/* https://www.huahanlink.com/ */ 
/* 技术：小王 QQ：491813163  微信：18223904336 */
@charset "utf-8";
/* 公共响应变量 */ 
@min1901: ~"(min-width: 1901px)"; @min1581: ~"(min-width: 1581px)"; @min1261: ~"(min-width: 1261px)"; @min992: ~"(min-width: 992px)"; @min768: ~"(min-width: 768px)"; 
@max1900: ~"(max-width: 1900px)"; @max1580: ~"(max-width: 1580px)"; @max1366: ~"(max-width: 1366px)"; @max1280: ~"(max-width: 1280px)"; @max1260: ~"(max-width: 1260px)"; @max1024: ~"(max-width: 1024px)"; @max990: ~"(max-width: 990px)"; @max767: ~"(max-width: 767px)"; @max480: ~"(max-width: 480px)";
/* 初始化*/ 
* { padding: 0; margin: 0; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

html { font-size: calc(100vw/19.2); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; scrollbar-width: thin; 
    @media @min1901{ font-size:100px; } 
    @media @max1580 { font-size: calc(100vw / 21);}
    @media @max1280 { font-size: calc(100vw / 19.3); }
    @media @max767{ font-size: calc(100vw/15); } 
    @media @max480{ font-size: calc(100vw/8); } 
}

body { min-height: 100%; font-family: "HONOR Sans CN", "Microsoft YaHei","Microsoft YaHei UI","SimSun","SimHei","Arial"; font-size:16px; color:#000; background:#fff; @media @max1580{ font-size:14px; }  @media @max767{ font-size:.28rem; } }
html, body { width: 100%; height: auto; margin: 0; padding: 0; position: relative; -webkit-overflow-scrolling: touch; overflow-x: hidden; }
img { max-width: 100%; max-height: 100%; height: auto; box-sizing: border-box; border: 0; vertical-align: middle; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
ul, ol { list-style: none; }
a { text-decoration: none; color: #000; display: block; cursor: pointer; }
img { max-width: 100%; max-height: 100%; border: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 120%; }
input, textarea { resize: none; }
input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; appearance: none; }
ul.swiper-wrapper { margin: 0; padding: 0; }
/* Flex 布局 */
.flex { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.f_column { -webkit-box-orient: vertical; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }
.f_column_right { -webkit-box-orient: vertical; -ms-flex-direction: column-reverse; -webkit-flex-direction: column-reverse; flex-direction: column-reverse; }
.f_row { -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; -o-flex-direction: row; flex-direction: row; }
.f_row_right { -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; -o-flex-direction: row-reverse; flex-direction: row-reverse; }
.j_center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; }
.j_end { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; }
.j_start { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
.j_justify { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
.j_around { -moz-justify-content: space-around; -webkit-justify-content: space-around; justify-content: space-around; }
.a_start { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; }
.a_end { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; align-items: flex-end; }
.a_center { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.a_baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
.a_stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; -webkit-align-items: stretch; align-items: stretch; }
.a_s_stretch { -webkit-box-self: stretch; -ms-align-self: stretch; -webkit-align-self: stretch; align-self: stretch; }
.a_s_center { -webkit-box-self: center; -ms-align-self: center; -webkit-align-self: center; align-self: center; }
.a_s_end { -webkit-box-self: end; -ms-align-self: end; -webkit-align-self: end; align-self: end; }
.flex_wrap { flex-wrap: wrap; -ms-flex-wrap: wrap; }
/* 文字超出隐藏 */
.text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text(@num) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: unit(@num); overflow: hidden; }
/* 动画 */
.abImg {position: absolute;	left: 50%;	top: 50%;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);}
.dh { -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; }
.dh(@time) { -webkit-transition: all unit(@time, s) ease; -o-transition: all unit(@time, s) ease; transition: all unit(@time, s) ease; }
.dh_block(@time) { -webkit-transition: all unit(@time, s) ease-in-out; -o-transition: all unit(@time, s) ease-in-out; transition: all unit(@time, s) ease-in-out; }
/* 动画延迟 */
.delay(@time) { -webkit-transition-delay: unit(@time, s); -o-transition-delay: unit(@time, s); transition-delay: unit(@time, s); }
.adelay(@time) { -webkit-animation-delay: unit(@time, s); -o-animation-delay: unit(@time, s); animation-delay: unit(@time, s); }
/* 比例 */
.pb { width: 100%; height: 0; padding-bottom: 100%; position: relative; z-index: 5; overflow: hidden; }
.ab { position: absolute; left: 0; top: 0; width: 100%; height: 100%; font-size: 0; text-align: center; overflow: hidden; }
/* 图片 水平垂直 居中 */
.abimg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); .dh }
/* 常用 CSS3 动画 */
/* 360 旋转 */
@keyframes run {0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}
@keyframes grow2 { 0% { transform: scale(1.2); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
/* 旋转 */
/* input框点击搜索时背景没有颜色 */ 
input:-webkit-autofill { background: transparent; transition: background-color 50000s ease-in-out 0s; -webkit-text-fill-color: unset; }
.xz(@size) { transform: rotate(unit(@size, deg)); -ms-transform: rotate(unit(@size, deg)); -moz-transform: rotate(unit(@size, deg)); -webkit-transform: rotate(unit(@size, deg)); -o-transform: rotate(unit(@size, deg)) }
/* 不显示滚动条 */
.scrollbar_0 { * { -ms-overflow-style: none;  /* IE and Edge */ scrollbar-width: none;  /* Firefox */ &::-webkit-scrollbar { display: none; } } }
.center_box { position: relative; z-index: 5; }
/* 媒体查询 缩写 */
@max2560:~"(max-width:2560px)";@max1920:~"(max-width:1920px)";@max1840:~"(max-width:1840px)";@max1800:~"(max-width:1800px)";@max1760:~"(max-width:1760px)";@max1720:~"(max-width:1720px)";
@max1680:~"(max-width:1680px)";@max1600:~"(max-width:1600px)";@max1560:~"(max-width:1560px)";@max1520:~"(max-width:1520px)";@max1470:~"(max-width:1470px)";@max1440:~"(max-width:1440px)";
@max1400:~"(max-width:1400px)";@max1366:~"(max-width:1366px)";@max1360:~"(max-width:1360px)";@max1320:~"(max-width:1320px)";@max1280:~"(max-width:1280px)";@max1270:~"(max-width:1270px)";
@max1200:~"(max-width:1200px)";@max1150:~"(max-width:1150px)";@max1024:~"(max-width:1024px)";@max990:~"(max-width:990px)";@max768:~"(max-width:768px)";@max640:~"(max-width:640px)";
@max480:~"(max-width:480px)";@max360:~"(max-width:360px)";
/* 布局 */
.pc { display: block; }  .wap, .mobile { display: none; }
@media @max990 { .pc { display: none; } .wap, .mobile { display: block; } }
.img_cover { width: 100%; height: 100%; object-fit: cover; }
.mar_b { margin-bottom:  0 !important; } .mar_t { margin-top:  0 !important; }
.pad_b { padding-bottom: 0 !important; } .pad_t { padding-top: 0 !important; }
.h100 { height: 100%; }
.head_nbsp { width: 100%; height: var(--header-height); .dh; }

:root {
  /* COLOR */
    --active_color: #0000b9; --active_color2: #7abc2b; --color_text: #282828;
    --color_FFF: #FFFFFF; --color_F6F: #f6f6f6; --color_F4F: #f4f4f4; 
    --color_EEE: #eeeeee; --color_DDD: #dddddd; --color_BBB: #bbbbbb; 
    --color_999: #999999; --color_666: #666666; --color_444: #444444; 
    --color_333: #333333; --color_222: #222222; --color_000: #000000;
    /* --- font40以下 */
    --font12: clamp(12px, (0.12rem * 1), 12px); --font14: clamp(12px, (0.14rem * 1), 14px); --font15: clamp(12px, (0.15rem * 1), 15px); --font16: clamp(13px, (0.16rem * 1), 16px); 
    --font17: clamp(13px, (0.17rem * 1), 17px); --font18: clamp(14px, (0.18rem * 1), 18px); --font20: clamp(15px, (0.20rem * 1), 20px); 
    --font22: clamp(16px, (0.22rem * 1), 22px); --font24: clamp(17px, (0.24rem * 1), 24px); --font26: clamp(18px, (0.26rem * 1), 26px); 
    --font28: clamp(18px, (0.28rem * 1), 28px); --font30: clamp(20px, (0.30rem * 1), 30px); --font32: clamp(20px, (0.32rem * 1), 32px); 
    --font34: clamp(22px, (0.34rem * 1), 34px); --font36: clamp(22px, (.36rem * 1), 36px); --font38: clamp(24px, (.38rem * 1), 38px); 
    /* --- font40 */
    --font40: clamp(23px, (.40rem * 1), 40px); --font42: clamp(24px, (.42rem * 1), 42px); --font44: clamp(24px, (.44rem * 1), 44px); 
    --font46: clamp(25px, (.46rem * 1), 46px); --font45: clamp(25px, (.45rem * 1), 45px); --font48: clamp(26px, (.48rem * 1), 48px); 
    /* --- font50 */
    --font50: clamp(28px, (.50rem * 1), 50px); --font52: clamp(28px, (.52rem * 1), 52px); 
    --font54: clamp(28px, (.54rem * 1), 54px); --font56: clamp(28px, (.56rem * 1), 56px); 
    --font58: clamp(29px, (.58rem * 1), 58px); 
    /* --- font60 */
    --font60: clamp(30px, (.60rem * 1), 60px); --font64: clamp(31px, (.66rem * 1), 64px);  --font66: clamp(31px, (.66rem * 1), 66px); 
    /* --- font70以及以上 */
    --font70: clamp(32px, (.70rem * 1), 70px); --font72: clamp(32px, (.72rem * 1), 72px); 
    --font80: clamp(32px, (.80rem * 1), 80px); 
    --font100: 1.0rem; --font120: 1.2rem; --font160: 1.6rem;
    --min-wh: 40px;
    --maskVH: 100vh;
}

/* 公共字体 */
.font12 { font-size: var(--font12); } .font14 { font-size: var(--font14); } .font16 { font-size: var(--font16); } 
.font18 { font-size: var(--font18); } .font20 { font-size: var(--font20); } .font22 { font-size: var(--font22); }
.font24 { font-size: var(--font24); } .font26 { font-size: var(--font26); } .font28 { font-size: var(--font28); }
.font30 { font-size: var(--font30); } .font32 { font-size: var(--font32); } .font34 { font-size: var(--font34); }
.font36 { font-size: var(--font36); } .font38 { font-size: var(--font38); } .font40 { font-size: var(--font40); }
.font42 { font-size: var(--font42); } .font44 { font-size: var(--font44); } 
.font45 { font-size: var(--font45); } .font46 { font-size: var(--font46); }
.font48 { font-size: var(--font48); line-height: 1.375; } .font50 { font-size: var(--font50); } .font52 { font-size: var(--font52); }
.font54 { font-size: var(--font54); } .font56 { font-size: var(--font56); } .font58 { font-size: var(--font58); }
.font60 { font-size: var(--font60); } .font66 { font-size: var(--font66); } .font70 { font-size: var(--font70); }
.font72 { font-size: var(--font72); } .font80 { font-size: var(--font80); } .font64 { font-size: var(--font64); }
.font100 { font-size: var(--font100); }  .font120 { font-size: var(--font120); }  .font160 { font-size: var(--font160); }
.font15 { font-size: var(--font15); }
/* 间距 */ 
.mar_t10{ margin-top: .10rem; } .mar_t13{ margin-top: .13rem; } .mar_t15{ margin-top: .15rem; } .mar_t17{ margin-top: .17rem; } 
.mar_t20{ margin-top: .20rem; } .mar_t23{ margin-top: .23rem; } .mar_t25{ margin-top: .25rem; } .mar_t27{ margin-top: .27rem; } 
.mar_t30{ margin-top: .30rem; } .mar_t33{ margin-top: .33rem; } .mar_t35{ margin-top: .35rem; } .mar_t37{ margin-top: .37rem; } 
.mar_t40{ margin-top: .40rem; } .mar_t43{ margin-top: .43rem; } .mar_t45{ margin-top: .45rem; } .mar_t47{ margin-top: .47rem; } 
.mar_t50{ margin-top: .50rem; } .mar_t53{ margin-top: .53rem; } .mar_t55{ margin-top: .55rem; } .mar_t57{ margin-top: .57rem; } 
.mar_t60{ margin-top: .60rem; } .mar_t63{ margin-top: .63rem; } .mar_t65{ margin-top: .65rem; } .mar_t67{ margin-top: .67rem; } 
.mar_t70{ margin-top: .70rem; } .mar_t73{ margin-top: .73rem; } .mar_t75{ margin-top: .75rem; } .mar_t77{ margin-top: .77rem; } 
.mar_t80{ margin-top: .80rem; } .mar_t83{ margin-top: .83rem; } .mar_t85{ margin-top: .85rem; } .mar_t87{ margin-top: .87rem; } 
.mar_t90{ margin-top: .90rem; } .mar_t93{ margin-top: .93rem; } .mar_t95{ margin-top: .95rem; } .mar_t97{ margin-top: .97rem; } 
.mar_t100{ margin-top: 1.00rem; } .mar_t105{ margin-top: 1.05rem; }
/* 文字颜色 */ 
.Coac { color: var(--active_color); }
.Co99 { color: var(--color_999); } .Co66 { color: var(--color_666); } .Co33 { color: var(--color_333); }
.Co22 { color: var(--color_222); } .Co00 { color: var(--color_000); } 

/* -------------------------------------------------------------------  字体 */
@font-face {font-family: "SourceHanSansCN"; src: url("../fonts/SourceHanSansCN-ExtraLight.ttf"); font-weight: 200;}
@font-face {font-family: "SourceHanSansCN"; src: url("../fonts/SourceHanSansCN-Light.ttf"); font-weight: 300;}
@font-face {font-family: "SourceHanSansCN"; src: url("../fonts/SourceHanSansCN-Regular.ttf"); font-weight: normal;}
@font-face {font-family: "SourceHanSansCN"; src: url("../fonts/SourceHanSansCN-Medium.ttf"); font-weight: 500;}
@font-face {font-family: "SourceHanSansCN"; src: url("../fonts/SourceHanSansCN-Bold.ttf"); font-weight: 600;}
@font-face {font-family: "SourceHanSansCN"; src: url("../fonts/SourceHanSansCN-Heavy.ttf"); font-weight: 700;}
@font-face {font-family: "Gilroy"; src: url("../fonts/Gilroy-Medium.otf"); font-weight: 500;}
@font-face {font-family: "Gilroy"; src: url("../fonts/Gilroy-Bold.otf"); font-weight: 600;}
@font-face {font-family: "Rubik"; src: url("../fonts/RUBIK-REGULAR-WEBFONT.TTF"); font-weight: normal;}


/* --------------------------------------------------------------- 全站内容区 */
// 全屏写法 
.container { width: 100%; max-width: 98%; margin: 0 auto; }
// 内容区写法
.w1440 { width: 100%; max-width: 1440px; margin: 0 auto; 
    @media @max1920 { max-width: 75%; }
    @media @max1720 { max-width: 83.72093023255814%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1710 { width: 100%; max-width: 1710px; margin: 0 auto; 
    @media @max1920 { max-width: 89.0625%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1740 { width: 100%; max-width: 1740px; margin: 0 auto; 
    @media @max1920 { max-width: 90.625%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
main { width: 100%; height: auto;  --header-height: 0.8rem; font-family: "Gilroy",  "SourceHanSansCN"; color: #222222;
	// &.active { --header-height: 70px; }
    @media @max990 { --header-height: 50px; }
}
.wowRight { opacity: 0; }
/* --------------------------------------------------------------- 导航占位 */
.head_nbsp { width: 100%; height: var(--header-height); .dh; }
.images_bg { width: 100%; height: auto; img, video { width: 100%; height: auto; } }
/* --------------------------------------------------------------- 锚点 */ 
.locate_item { width: 100%; height: 0; }
/* --------------------------------------------------------------- 全站左右结构 */ 
.box_info { width: 100%; height: auto; .flex; .j_justify; 
    @media @max990 { .f_column; gap: 0.5rem;
        .left_box , .right_box { width: 100% !important; height: auto; }
    }
}
.bg_gra { background: linear-gradient(to right, rgb(255, 190, 190), rgb(191, 255, 191)); }
.te_gra { background-image: linear-gradient(180deg, #e3e3e375, #ffffff00); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* --------------------------------------------------------------- 手机端轮播图分页器 */ 
.idxPageHide { display: none; 
    @media @max990 {  width: 100%; height: auto; .flex; .j_center; gap: 5px; margin-top: 20px;
        span { width: 5px; height: 5px; }
        .swiper-pagination-bullet-active { background: var(--active_color); }
    }
}
/* --------------------------------------------------------------- PC和手机端 轮播图分页器 */ 
.idxPageShow { width: 100%; height: auto; .flex; .j_center; gap: 0.12rem; margin-top: 0.5rem;
    span { width: 8px; height: 8px; background: none; border: 1px solid #DDDDDD; opacity: 1; .dh; }
    .swiper-pagination-bullet-active { background: var(--active_color2); border-color: var(--active_color2); }
}


.swiperBtn { width: 0.5rem; height: 0.5rem; min-width: var(--min-wh); min-height: var(--min-wh); .flex; .a_center; .j_center; border-radius: 100px; border: 1px solid #ffffff80; cursor: pointer; position: relative; z-index: 1; .dh;
    &::after { content:''; position: absolute; width: 0; height: 0; background: var(--active_color2); z-index: -1; .dh; border-radius: 100px;  }
    i { color: var(--color_FFF); font-size: var(--font16); }
    &:hover { border-color: var(--active_color2);
        &::after { width: 100%; height: 100%; }
    }
}

.pager_box { width: 100%; height: auto; .flex; gap: 0.09rem;
    .swiperBtn2 { width: 1rem; height: 0.4rem; .flex; .a_center; .j_center; border-radius: 100px; border: 2px solid #ccccf1; cursor: pointer; .dh;
        i { font-size: var(--font32); color: var(--active_color); .dh; }
        &:hover { background: var(--active_color2); color: #FFFFFF; border-color: var(--active_color2); 
            i { color: var(--color_FFF); }
        }
    }
}

.idx_title { width: 100%; height: auto; 
    .t1 { font-weight: 600; }
    .t2 { color: #666666; margin-top: 0.25rem; }
}

.idx_more { width: 100%; height: auto; 
    .more { width: fit-content; height: 0.42rem; min-height: 35px; .flex; .a_center; .j_center; padding: 0 0.36rem; border-radius: 100px; background: var(--color1); color: var(--color2); font-size: var(--font15); }
}
.layPager { width: 100%; height: auto; margin-top: 1.2rem; }
.navBoxCon1 { width: 100%; height: auto; .flex; .a_center; gap: 0.14rem; padding-top: 0.3rem; padding-bottom: 0.2rem;
    .one {  color: #666666; font-size: var(--font16); }
}
.pagerSwiper { width: fit-content; .flex; .a_center; .j_center; gap: 0.18rem; 
    .btnSwi { width: 0.5rem; height: 0.5rem; min-width: 38px; min-height: 38px; .flex; .a_center; .j_center; border: 2px solid #c9c9c9; border-radius: 50%; .dh; cursor: pointer;
        i { color: #cfcfcf; font-weight: 300; .dh; font-size: var(--font22); }
        &:hover { background: var(--active_color2); border-color: var(--active_color2); i { color: #FFFFFF !important; } }
    }
}
.fw300 { font-weight: 300; } .fw500 { font-weight: 500; } .fw600 { font-weight: 600; } .fw700 { font-weight: 700; } 
.mt20 { margin-top: 0.2rem; }
@keyframes run2 {0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}
.pagerBtn { position: fixed; z-index: 10; top: 0%; left: 0%; width: 1.01rem; height: 1.01rem;  border-radius: 50%; transform: translateY(-50%) translateX(-50%) scale(0); pointer-events: none; opacity: 0; .flex; .a_center; .j_center;
    .icon { position: absolute; .flex; .a_center; .j_center; width: 0.7rem; height: 0.7rem; background: var(--active_color2); border-radius: 50%; }
    .img { animation: run2 18s linear infinite; width: 100%; height: auto; img { width: 100%; height: auto; } }
}

.wowUpS { opacity: 0; } 








/* --------------------------------------------------------------- 首页 */ 
.idx_banner { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; .flex; .a_center; .j_center;
    .swiper_box { width: 100%; height: auto; background: #000000; overflow: hidden;
        ul li { width: 100%; height: auto; 
            .centerInfo { width: 100%; height: auto; position: relative; z-index: 1; .flex; .a_center;
                .word_box { position: absolute; width: 100%; height: auto; 
                    .icon { width: fit-content; height: 0.34rem; min-height: 25px; padding: 0.08rem 0.17rem; font-size: var(--font14); color: var(--color_FFF); background: var(--active_color2); border-radius: 100px; line-height: 1; .flex; .a_center; .j_center; transform: translateY(50px); opacity: 0; .dh(0.7); }
                    .word { width: 100%; height: auto; margin-top: 0.25rem; color: var(--color_FFF); font-weight: 600; transform: translateY(50px); opacity: 0; .dh(0.7); }
                }
                .icon_box { position: absolute;  right: 20%; top: 40%; .flex; .a_center; .j_center;
                    .icBox { width: auto; height: auto; position: relative; z-index: 1; .flex; .a_center; .j_center; opacity: 0;
                        img { max-width: unset;  max-height: unset; width: 100%; height: auto; }
                        .icon { position: absolute; width: 1.45rem; height: 1.45rem; }
                        .icon2 { animation: run 50s linear infinite; width: 2.52rem; height: 2.52rem; }
                    }
                    .img_bg { width: 100%; height: 100%; position: absolute; .flex; .a_center; .j_center;
                        .ic { position: absolute; width: 0; height: 0; transform: translateY(20px); opacity: 0; .flex; .a_center; .j_center; }
                        img { max-width: unset;  max-height: unset; width: var(--width); }
                    }
                }
            }
            &.swiper-slide-active {
                .centerInfo .icon_box {
                    .icBox { opacity: 1; .dh(1.2); }
                    .img_bg .ic  { transform: translateY(0); opacity: 1;  .dh(1.2);  }
                }
                .centerInfo .word_box {
                    .icon { transform: translateY(0); .delay(0.5); opacity: 1; }
                    .word { transform: translateY(0); .delay(0.7); opacity: 1; }
                }
            }
            .images_bg img.wap { min-height: 500px; object-fit: cover; }
        }
    }
    .swiperBtn { position: absolute; z-index: 5; right: 5.2%; 
        &.prev { left: 5.2%; }
    }
    .downBox { width: 0.28rem; height: auto; bottom: 0.4rem; position: absolute; z-index: 6; }
    @media @max990 {
        .swiperBtn { display: none !important; }
    }
}
.idx_case { width: 100%; height: auto; position: relative; z-index: 1; padding: 1.2rem 0; 
    .box_info { width: 100%; height: auto; .a_end;
        .left_box { width: 32%; position: relative; z-index: 2;
            .pager_box { width: 100%; height: auto; margin-top: 1rem; }
            .idxNumber { width: 100%; height: auto; margin-top: 1.2rem;  position: relative; z-index: 10; font-size: var(--font16); color: var(--color_999); font-weight: 600;
                .swiper-pagination-current { color: var(--color_000); }
            }
        }
        .right_box { width: 59.448%; position: relative; z-index: 1; padding-right: 20px;
            &::after { content:''; position: absolute; z-index: 2; bottom: 0; right: calc(100% + 3px); width: 100%; height: 100%; background: #ffffff; .dh; }
            .swiper_box { width: 100%; height: auto; position: relative; z-index: 1;
                ul li { width: 100%; height: auto; 
                    .centerInfo { width: 100%; height: auto; position: relative; z-index: 1; border-radius: 0.3rem; overflow: hidden; cursor: pointer;
                        .images { width: 100%; height: auto; position: relative; z-index: 1; .pb { padding-bottom: 137%; } }
                        .ima_bg { width: 0%; height: 100%; position: absolute; z-index: 2; top: 0; right: 0; .dh(0.5); img { width: 100%; height: 100%;object-fit: cover; max-height: unset; } }
                        .word { width: 100%; height: 100%; position: absolute; z-index: 3; top: 0; left: 0; padding: 0.5rem 0.4rem; color: var(--color_FFF);
                            .t2 { width: 100%; height: auto; margin-top: 0.1rem; }
                        }
                        &:hover {
                            .ima_bg { width: 100%; left: 0; }
                        }
                    }
                }
            }
        }
    }
}
.idx_select { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.4rem; padding-bottom: 0.9rem; 
    background-image: url(../images/bg1.jpg); background-repeat: no-repeat; background-size: cover;
    .item_box { width: 100%; height: auto; .flex; .j_justify; gap: 0.2rem; margin-top: 0.65rem;
        .item { width: 14.51388888888889%; background: #FFFFFF; border-radius: 0.2rem; cursor: pointer; .dh; position: relative; overflow: hidden;  .flex; .a_center; .j_center;
            &::after { content:''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background: var(--active_color2); opacity: 0; .dh(0.1); z-index: 1; }
            .befor { width: 100%; height: auto;  position: relative; z-index: 2; padding-top: 1.2rem; padding-bottom: 0.8rem; .flex; .f_column; .a_center; gap: 1.6rem; 
                .word { width: 100%; height: auto; .flex; .f_column; .a_center; text-align: center;
                    .img { width: 0.58rem; }
                    .t1 { margin-top: 0.37rem; }
                }
                .icon { width: 0.46rem; height: 0.46rem; .flex; .a_center; .j_center; border: 1px solid #e1e1e1; i { font-size: 12px; } }
            }
            .after { width: 100%; height: 100%; padding: 0 0.75rem;  position: absolute; top: 0; left: 0; z-index: 2; padding-top: 0.2rem; .flex; .f_column; .a_center; .j_center; text-align: center; opacity: 0;
                .icon  { width: 1.01rem; height: 1.01rem; flex-shrink: 0; .flex; .a_center; .j_center; .flex; .a_center; .j_center; border: 1px solid #ffffff33; border-radius: 50%; .dh(0); .delay(0); opacity: 0; transform: translateY(20px); 
                    img { filter: brightness(0) invert(1); width: 0.58rem; } 
                }
                .t1 { margin-top: 0.4rem; color: #FFFFFF; font-weight: 500; .dh(0); .delay(0); opacity: 0; transform: translateY(20px); }
                .t2 { margin-top: 0.1rem; line-height: 2; color: #FFFFFF; .dh(0); .delay(0); opacity: 0; transform: translateY(20px); }
                .idx_more { margin-top: 0.5rem; .dh(0); .delay(0);  opacity: 0; transform: translateY(20px); .flex; .a_center; .j_center; }
            }
            &.active { width: 52.01388888888889%; 
                &::after { opacity: 1; }
                .after { opacity: 1; 
                    .icon { .dh(0.6); .delay(0.2);  opacity: 1; transform: translateY(0px); }
                    .t1 { .dh(0.6); .delay(0.4);  opacity: 1; transform: translateY(0px); }
                    .t2 { .dh(0.6); .delay(0.6);  opacity: 1; transform: translateY(0px); }
                    .idx_more { .dh(0.6); .delay(0.8);  opacity: 1; transform: translateY(0px); }
                }
                .befor { opacity: 0; }
            }
        }
        @media @max990 { display: grid; grid-template-columns: repeat(2, 1fr); 
            .item { width: 100% !important; padding:0.5rem 0.2rem; padding-top: 0.4rem;
                &::after { opacity: 1 !important; z-index: -1 !important; }
                .befor { display: none !important; }
                .after { width: 100%; height: auto;  position: relative; z-index: 1; opacity: 1 !important; padding: 0; text-align: left; .a_start;
                    .icon, .t1, .t2, .idx_more { opacity: 1!important; transform: translateY(0) !important;  }
                    .icon { width: 0.8rem; height: 0.8rem; img { width: 0.4rem; } }
                    .t2 { line-height: 1.5; }
                }
                .idx_more { display: none !important; }
            }
        }
    }
}
.idx_cooperate { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; margin-top: .1rem; .flex; .j_justify; gap: 0.1rem;
    .item { width: 100%; height: auto; position: relative; z-index: 1; 
        .images_bg { width: 100%; height: auto; position: relative; z-index: 1; img { width: 100%; height: auto; } }
        .word { position: absolute; width: 100%; height: auto; z-index: 2; top: 0.93rem; padding: 0 8%; 
            .idx_more { margin-top: 0.5rem; width: 100%; height: auto; }
            .idx_title .t2 { margin-top: 0.15rem; }
        }
        &:first-child .word { padding-left: 25%; }
    }
    @media @max990 { .f_column; 
        .item:first-child .word { padding-left: 8%; }
    }
}

.idx_cooperate2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; margin-top: .1rem; .flex; .j_justify; padding: 2rem;
    background-attachment: fixed; background-image: url(../images/banner1.jpg); background-size: cover;
    .item { width: 100%; height: auto; position: relative; z-index: 1; .flex; .a_center; .j_center; .f_column_right;
        .word { position: relative; width: 100%;  max-width: 1440px; height: auto; z-index: 2; .flex; .a_center; .j_center; .f_column;
            .idx_more { margin-top: 0.5rem; width: 100%; height: auto; }
            .idx_title { width: 100%;
                .t2 { margin-top: 0.15rem; }
            }
            @media @max1920 { max-width: 75%; }
            @media @max1720 { max-width: 83.72093023255814%; }
            @media @max990 { max-width: 100%; padding: 0 20px; }
        }
        .images_bg { width: 100%; height: auto; position: relative; z-index: 1; display: none; img { width: 100%; height: auto; } }
    }
    @media @max990 { .f_column; 
        .item:first-child .word { padding-left: 8%; }
    }
}
.idx_solve { width: 100%; max-width: 1920px; height: auto; position: relative; z-index: 1; overflow: hidden; margin: 0 auto; padding-top: 0.7rem; display: none;
    .idx_title { text-align: center; position: absolute; }
    .maskBox { width: 100%; height: 250vh; .flex; .j_center;  overflow: hidden; position: relative; z-index: 1;
        .mask { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; 
            .content { width: 89.0625%; height: 100vh; .flex; .a_center;  position: relative; z-index: 1; gap: 0.5rem; .j_justify; margin: 0 auto;
                .item { width: 100%; height: auto; 
                    .images { width: 100%; height: auto; border-radius: 0.15rem; overflow: hidden; .pb { padding-bottom: 73%; .ab img { width: 100%; height: 100%; object-fit: cover; } } }
                    .word { width: 100%; height: auto; text-align: center; margin-top: 0.3rem; 
                        .t1 { font-weight: 500; }
                        .t2 { margin-top: 0.12rem; color: #999999;}
                    }
                }
                .left { width: 23%;  flex-shrink: 0;  
                    .item .images .pb .ab .img { width: 100%; height: 100%;
                        img { position: absolute; top: 0; left: 0; opacity: 0; 
                            &.active { opacity: 1; }
                        }
                    }

                }
                .center { width: 23%; flex-shrink: 0; }
                .right { width: 49%; .flex; gap: 0.5rem; flex-shrink: 0; 
                    .item { width: 50%; }
                }
            }
            .select_box { width: 100%; height: auto; position: absolute; bottom: 0; left: 0; .flex; .a_center; .j_center; z-index: 11; backdrop-filter: blur(10px);
                &::after { content:''; position: absolute; top: 0; right: 0; width: 100%; height: 1px; opacity: 0.5; background: #FFF; .dh; }
                .item { width: 100%; height: 1.11rem; .flex; .a_center; .j_center; position: relative; z-index: 1; font-size: var(--font24); color: #FFF; .flex; gap: 0.17rem; cursor: pointer;
                    &::after { content:''; position: absolute; bottom: 0; right: 0; width: 1px; height: 100%; background: #FFF; opacity: 0.5; .dh; }
                    &.active { background: var(--active_color2); }
                }
            }
            .word_box { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; z-index: 6; padding-top: 1.8rem;
                .textBox { .flex; .j_end;
                    .item_box { width: 33.3333%; background: #FFFFFF; padding: 0.5rem; border-radius: 0.3rem; overflow: hidden; .flex; .f_column; gap: 0.3rem;
                        .item { width: 100%; height: auto; 
                            .one { font-size: var(--font32); .flex; .j_justify; cursor: pointer;
                                span { color: #999999; font-weight: 600; line-height: 1; .dh; }
                                .icon { width: 0.38rem; height: 0.38rem; border: 1px solid #b3b3b3; border-radius: 50%; .flex; .a_center; .j_center; 
                                    &::after { content:''; position: absolute; width: 0.16rem; height: 2px; background: #b3b3b3; .dh; }
                                    &::before { content:''; position: absolute; width: 0.16rem; height: 2px; background: #b3b3b3; .dh; transform: rotate(90deg); }
                                }
                            }
                            .tow { display: none; font-size: var(--font15); margin-top: 0.3rem; line-height: 1.5; color: #666666; padding-bottom: 0.18rem;
                                .idx_more { width: 100%; height: auto;  margin-top: 0.2rem; }
                            }
                            &.active {
                                .one {
                                    span { color: #000; }
                                    .icon::before { transform: rotate(0); }
                                }
                            }
                        }
                    }
                }   
            }
        }
    }
}
.idx_scheme { width: 100%; height: 700vh; position: relative; z-index: 1; overflow: hidden; 
    .maskBox { width: 100%; height: var(--maskVH); position: absolute; top: 0; left: 0; 
        .content1 { width: 100%; height: var(--maskVH); position: absolute; z-index: 2; top: 0; left: 0; padding-top: 0.7rem; .flex; .a_center; .j_center; .f_column; background: #FFFFFF; 
            .center_box { width: 100%; height: auto; padding: 0 4.453125%; }
            .idx_title { width: 100%; height: auto;  text-align: center; }
            .item_box { width: 100%; height: auto; .flex; .a_center; gap: 0.7rem; margin-top: 0.5rem;
                .item { width: calc(25% -  0.525rem); height: auto; transform: var(--tY); flex-shrink: 0;
                    .images { width: 100%; height: auto; border-radius: 0.15rem; overflow: hidden; .pb { padding-bottom: 72.5%; img { width: 100%; height: 100%; object-fit: cover; } } }
                    .word { width: 100%; height: auto; margin-top: 0.2rem; text-align: center;
                        .t1 { font-weight: 500; }
                        .t2 { width: 100%; height: auto; margin-top: 0.1rem; color: #999999; }
                    }
                    &.active { transform-origin: left bottom; }
                }
            }
        }
        .content2 { width: 100%; height: var(--maskVH); position: absolute; z-index: 1; top: 0; left: 0; .flex; .a_center; .j_center; .f_column; 
            .swiper_info { width: 100%; height: 100%; position: relative; z-index: 1; 
                .swiper_box { width: 100%; height: auto; position: relative; z-index: 1;
                    ul li { width: 100%; height: auto; 
                        .centerInfo { width: 100%; height: 100vh; position: relative; z-index: 1; 
                            .word_box { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 3; padding-bottom: 1.1rem;
                                .w1440 { height: 100%; .flex; .j_end; .a_center; }
                                .selectB { width: 33.3333%; background: #FFFFFF; padding: 0.5rem; border-radius: 0.3rem; overflow: hidden; .flex; .f_column; gap: 0.3rem; 
                                    .item { width: 100%; height: auto; 
                                        .top { font-size: var(--font32); .flex; .j_justify; cursor: pointer;
                                            span { color: #999999; font-weight: 600; line-height: 1; .dh; }
                                            .word {  }
                                            .icon { width: 0.38rem; height: 0.38rem; border: 1px solid #b3b3b3; border-radius: 50%; .flex; .a_center; .j_center; 
                                                &::after { content:''; position: absolute; width: 0.16rem; height: 2px; background: #b3b3b3; .dh; }
                                                &::before { content:''; position: absolute; width: 0.16rem; height: 2px; background: #b3b3b3; .dh; transform: rotate(90deg); }
                                            }
                                        }
                                        .bot { display: none; font-size: var(--font15); margin-top: 0.3rem; line-height: 1.5; color: #666666; padding-bottom: 0.18rem;
                                            .idx_more { width: 100%; height: auto;  margin-top: 0.2rem; }
                                        }
                                        &.active .top { span { color: #000; } .icon::before { transform: rotate(0); } }
                                    }
                                }
                            }
                            .img { width: 100%; height: 100%; position: relative; z-index: 1; img { width: 100%; height: 112vh; max-height: unset; object-fit: cover; } }
                        }
                    }
                }
                .item_box { width: 100%; height: auto; position: absolute; z-index: 5; bottom: 0; left: 0; .flex; .a_center; .j_center; z-index: 11; backdrop-filter: blur(10px); opacity: 0;
                    &::after { content:''; position: absolute; top: 0; right: 0; width: 100%; height: 1px; opacity: 0.5; background: #FFF; .dh; }
                    .item { width: 100%; height: 1.11rem; .flex; .a_center; .j_center; position: relative; z-index: 1; font-size: var(--font24); color: #FFF; .flex; gap: 0.17rem; cursor: pointer;
                        &::after { content:''; position: absolute; bottom: 0; right: 0; width: 1px; height: 100%; background: #FFF; opacity: 0.5; .dh; }
                        &.active { background: var(--active_color2); }
                    }
                }
            }
        }
    }
    @media @max990 { width: 100%; height: auto; 
        .maskBox { width: 100%; height: auto; position: relative; z-index: 1; 
            .content1 { width: 100%; height: auto; position: relative; z-index: 1;
                .item_box { display: none; }
                .idx_title { text-align: left; }
            }
            .content2 { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.7rem; 
                .swiper_info .swiper_box ul li .centerInfo { width: 100%; height: auto; .flex; .f_column_right;
                    .word_box { width: 100%; height: auto; height: auto; position: relative; z-index: 1; padding-bottom: 0; margin-top: 0.8rem;
                        .selectB { width: 100%; height: auto; border: 1px solid #0000001c; }
                    }
                    .img img { width: 100%; height: auto; }
                }
            }
        }
    }
}

.idx_solution { width: 100%; height: auto; position: relative; z-index: 1; padding: 1.2rem 0; overflow: hidden; 
    .center_box { width: 100%; height: auto; 
        .idx_title { width: 100%; height: auto;  text-align: center; }
        .item_box { width: 100%; height: auto; .flex; .a_center; gap: 0.7rem; margin-top: 0.5rem;
            .item { width: calc(25% -  0.525rem); height: auto; 
                .images { width: 100%; height: auto; border-radius: 0.15rem; overflow: hidden; .pb { padding-bottom: 72.5%; img { width: 100%; height: 100%; object-fit: cover; } } }
                .word { width: 100%; height: auto; margin-top: 0.2rem; text-align: center;
                    .t1 { font-weight: 500; }
                    .t2 { width: 100%; height: auto; margin-top: 0.1rem; color: #999999; }
                }
                &.active { transform-origin: left bottom; }
            }
            @media @max990 { display: none; grid-template-columns: repeat(1, 1fr);
                .item { width: 100%; height: auto; 
                    .images .pb { padding-bottom: 41.5%; }
                }
            }
        }
    }
    @media @max990 { padding-bottom: 0.5rem; }
}

.idx_solution2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; background: #000000;
    .swiper_box { width: 100%; height: auto; 
        ul li { width: 100%; height: auto; 
            .centerInfo { width: 100%; height: auto; position: relative; z-index: 1; 
                .swiper_img { width: 100%; height: auto; 
                    .img_bg { width: 100%; height: 100vh; img { width: 100%; height: 100%; object-fit: cover; } }
                }
                .selectB { width: 33.3333%; background: #FFFFFF; padding: 0.5rem; border-radius: 0.3rem; overflow: hidden; .flex; .f_column; gap: 0.3rem; position: absolute; z-index: 10; right: 12.5%; top: calc(var(--header-height) + 0.5rem);
                    .item { width: 100%; height: auto; 
                        .top { font-size: var(--font32); .flex; .j_justify; cursor: pointer;
                            span { color: #999999; font-weight: 600; line-height: 1; .dh; }
                            .word {  }
                            .icon { width: 0.38rem; height: 0.38rem; border: 1px solid #b3b3b3; border-radius: 50%; .flex; .a_center; .j_center; 
                                &::after { content:''; position: absolute; width: 0.16rem; height: 2px; background: #b3b3b3; .dh; }
                                &::before { content:''; position: absolute; width: 0.16rem; height: 2px; background: #b3b3b3; .dh; transform: rotate(90deg); }
                            }
                        }
                        .bot { display: none; font-size: var(--font15); margin-top: 0.3rem; line-height: 1.5; color: #666666; padding-bottom: 0.18rem;
                            .idx_more { width: 100%; height: auto;  margin-top: 0.2rem; }
                        }
                        &.active .top { span { color: #000; } .icon::before { transform: rotate(0); } }
                    }
                }
            }
        }
    }
    .item_box { width: 100%; height: auto; position: absolute; z-index: 5; bottom: 0; left: 0; .flex; .a_center; .j_center; z-index: 11; backdrop-filter: blur(10px);
        &::after { content:''; position: absolute; top: 0; right: 0; width: 100%; height: 1px; opacity: 0.5; background: #FFF; .dh; }
        .item { width: 100%; height: 1.11rem; .flex; .a_center; .j_center; position: relative; z-index: 1; font-size: var(--font24); color: #FFF; .flex; gap: 0.17rem; cursor: pointer;
            &::after { content:''; position: absolute; bottom: 0; right: 0; width: 1px; height: 100%; background: #FFF; opacity: 0.5; .dh; }
            &.active { background: var(--active_color2); }
        }
    }
    @media @max990 { .flex; .f_column_right;  background: unset;
        .item_box { position: relative; z-index: 1; bottom: unset; left: unset; display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid #eee; border-bottom: 0; border-left:  0;
            .item { border-bottom: 1px solid #eee; border-left: 1px solid #eee;
                img { filter: brightness(0) invert(0.5); }
                span { color: #666666; }
                &.active {
                    img {  filter: unset; }
                    span { color: #FFFFFF; }
                }
            }
        }
        .swiper_box ul li .centerInfo {
            .swiper_img .img_bg { width: 100%; height: 40vh; }
            .selectB { position: relative; z-index: 1; width: 90%; height: auto; right: unset; top: unset; border: 1px solid #e5e5e5; margin: auto; margin-top: 0.5rem;
                
            }
        }
    }
}

/* --------------------------------------------------------------- 新闻 */ 
.ins_newCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; background: #f5f5f5; padding-bottom: 0.93rem; 
    .img_bg { width: 100%; height: 6.6rem; position: absolute; top: 0; left: 0; img { width: 100%; height: 100%; object-fit: cover; } }
    .center_box { width: 100%; height: auto; 
        .word_box { width: 100%; height: auto; padding-top: 2.3rem; padding-bottom: 2.1rem;
            .t1 { width: 100%; height: auto; font-weight: 700; }
            .t2 { width: 100%; height: auto; margin-top: 0.2rem; }
        }
        .swiper_info { width: 100%; height: auto; background: #FFFFFF; padding: 0.55rem;
            .swiper_box { width: 100%; height: auto; overflow: hidden;
                ul li { width: 100%; height: auto;
                    .centerInfo { width: 100%; height: auto; .a_center; opacity: 0; .dh(1.5);
                        .left_box { width: 49.7%;
                            .img { width: 100%; height: auto; .pb { padding-bottom: 69%; } }
                        }
                        .right_box { width: 46.5%;
                            .word { width: 100%; height: auto;
                                .t1 { width: 100%; height: auto; color: var(--active_color2); }
                                .t2 { width: 100%; height: auto; margin-top: 0.2rem;  font-weight: 600; line-height: 1.333; }
                                .t3 { width: 100%; height: auto;  margin-top: 0.4rem; line-height: 1.875; color: #999999; }
                                .idx_more { width: 100%; height: auto; margin-top: 0.55rem; }
                            }
                        }
                    }
                    &.swiper-slide-active .centerInfo { opacity: 1; }
                }
            }
        }
    }
}
.ins_newCon2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 0.2rem 0;
    .center_box { width: 100%; height: auto; 
        .left_box { width: fit-content; height: auto; 
            .item_box { width: fit-content; height: auto; .flex; .a_center; gap: 0.27rem; 
                .item { width: fit-content; padding: 0.13rem 0.22rem; background: #f5f5f5; .flex; .a_center; .j_center; gap: 0.15rem; line-height: 1; border-radius: 0.06rem; border: 1px solid #dfdfdf; cursor: pointer; .dh; img, span { .dh; }
                    &.active { background: var(--active_color2); border-color: var(--active_color2); 
                        img { filter: brightness(0) invert(1); }
                        span { color: #FFFFFF; }
                    }
                    &:hover { border-color: var(--active_color2); }
                }
            }
        }
        .right_box { width: fit-content; height: auto; 
            .input_box { width: 2.66rem; height: 0.4rem; min-height: 35px; background: #f5f5f5; border: 1px solid #dfdfdf; border-radius: 0.06rem; .flex; .j_justify; 
                input { width: 100%; height: auto; border: 0; background: none; padding-left: 0.18rem;  font-size: var(--font16); }
                button { width: 0.4rem; height: 0.4rem; min-width: 35px; min-height: 35px; flex-shrink: 0; border: 0; background: none; font-size: var(--font14); cursor: pointer; }
            }
        }
    }
    @media @max990 { padding: 0.5rem 0;
        .center_box .right_box .input_box { width: 100%; height: auto; }
    }
}
.ins_newCon3 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; background: #f5f5f5; padding-top: 0.8rem; padding-bottom: 0.93rem;  
    .center_box { width: 100%; height: auto; 
        .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.7rem 0.48rem; 
            .item { width: 100%; height: auto; cursor: pointer;
                .img { width: 100%; height: auto; .pb { padding-bottom: 69%; .ab img { width: 100%; height: 100%; object-fit: cover; .dh; } } }
                .word { width: 100%; height: auto; margin-top: 0.35rem;
                    .t1 { width: 100%; height: calc(2em * 1.6); .text(2); line-height: 1.6; font-weight: 500; max-width: 80%; .dh; }
                    .t2 { width: 100%;  height: calc(2em * 1.875); .text(2); margin-top: 0.25rem; line-height: 1.875; color: var(--color_333); }
                    .t3 { width: 100%; height: auto; margin-top: 0.35rem; color: var(--active_color2); }
                }
                &:hover  {
                    .img .pb .ab img { transform: scale(1.05); }
                    .word .t1 { color: var(--active_color2); }
                }
            }   
            @media @max990 { display: grid; grid-template-columns: repeat(1, 1fr); }
        }
    }
}
.ins_newdCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; background: #f5f5f5; padding-bottom: 0.65rem;
    .center_box { width: 100%; height: auto; 
        .box_info { width: 100%; height: auto;  background: #FFFFFF;
            .contentCon1 { width: 70%; height: auto; background: #FFFFFF; padding: 0 0.66rem; padding-top: 0.75rem; padding-bottom: 0.6rem; overflow: hidden;
                .word { width: 100%; height: auto; text-align: center; padding-bottom: 0.3rem; position: relative; z-index: 1;
                    &::after { content:''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50vw);  width: 100vw;  height: 1px; background: #e8e8e8; .dh; }
                    .t1 { font-weight: 600; }
                    .icon { width: 100%; height: auto; .flex; .a_center; .j_center; margin-top: 0.25rem; gap: 0.2rem; color: #999999;
                        .one { width: fit-content; .flex; .a_center; .j_center; gap: 0.1rem; font-size: var(--font14); }
                    }
                }
                .content { width: 100%; height: auto; line-height: 1.875; font-size: var(--font16); padding-top: 0.5rem; color: #666666; padding-bottom: 0.7rem;
                    p { min-height: 0.5em; }
                    .img { width: 100%; height: auto; text-align: center;  }
                    img { width: 100% !important; height: auto !important;  }
                }
                .pagerNew { width: 100%; height: auto; .flex; .a_center; .j_justify; padding-top: 0.6rem; position: relative; z-index: 1; gap: 0.5rem;
                    &::after { content:''; position: absolute; top: 0; left: 50%; transform: translateX(-50vw);  width: 100vw; height: 1px; background: #e8e8e8; .dh; }
                    .word_B { width: fit-content; font-size: var(--font16); .flex; .f_column; gap: 0.12rem;
                        .one { color: #666666; line-height: 1.2; .dh; 
                            &:hover { text-decoration: underline; color: var(--active_color); }
                        }
                    }
                    .idx_more { width: fit-content; flex-shrink: 0; .more { .flex; .a_center; .j_center; gap: 0.1rem; } }
                }
                @media @max990 { padding: 0.6rem 0.4rem;  
                    .pagerNew { .f_column; 
                        .idx_more  { display: none; }
                    }
                }
            }
            .right_box { width: 28%; height: auto; padding: 0.75rem 0.4rem; background: #FFFFFF; border-left: 1px solid #e8e8e8;
                .title { width: 100%; height: auto; border-bottom: 1px solid #e8e8e8; padding-bottom: 0.15rem; .flex; .a_center; .j_justify;
                    .one { font-size: var(--font14); color: var(--active_color); .dh; &:hover { color: var(--active_color2); } }
                }
                .item_box { width: 100%; height: auto; margin-top: 0.30rem; .flex; .f_column; gap: 0.2rem;
                    .item { width: 100%; height: auto; border-bottom: 1px solid #e8e8e8; padding-bottom: 0.2rem;
                        .t3 { width: 100%; height: auto; line-height: 1.55; color: #333333; .dh; }
                        .t4 { width: 100%; height: auto; margin-top: 0.08rem; color: var(--color_999); }
                        &:hover {
                            .t3 { color: var(--active_color2); }
                        }
                    }
                    &.gap40 { gap: 0.4rem; }
                }
            }
        }
    }
}
.ins_newdCon2 { width: 100%; height: auto;  position: relative; z-index: 1; overflow: hidden; background: #f5f5f5; padding-top: 0.65rem; padding-bottom: 1.3rem;
    .center_box { width: 100%; height: auto; 
        .top_box { width: 100%; height: auto; .flex; .j_justify; .a_center; }
        .swiper_box { width: 100%; height: auto; overflow: hidden; margin-top: 0.6rem;
            ul li { width: 33.3%; 
                .item { width: 100%; height: auto; cursor: pointer;
                    .img { width: 100%; height: auto; .pb { padding-bottom: 69%; .ab img { width: 100%; height: 100%; object-fit: cover; .dh; } } }
                    .word { width: 100%; height: auto; margin-top: 0.35rem;
                        .t1 { width: 100%; height: calc(2em * 1.6); .text(2); line-height: 1.6; font-weight: 500; max-width: 80%; .dh; }
                        .t2 { width: 100%;  height: calc(2em * 1.875); .text(2); margin-top: 0.25rem; line-height: 1.875; color: var(--color_333); }
                        .t3 { width: 100%; height: auto; margin-top: 0.35rem; color: var(--active_color2); }
                    }
                    &:hover  {
                        .img .pb .ab img { transform: scale(1.05); }
                        .word .t1 { color: var(--active_color2); }
                    }
                }   
            }
        }
    }
}


.ins_solveCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 0.96rem; padding-bottom: 1rem; 
    .center_box { width: 100%; height: auto; .flex; .a_center; .f_column;  gap: 0.7rem;
        .content { width: 100%; height: auto; position: relative; z-index: 1; 
            .title { width: fit-content; position: relative; z-index: 1; line-height: 1.48; 
                &::after { content:''; position: absolute;  width: 0.21rem; height: 0.21rem; background: var(--active_color2); .dh; border-radius: 50%; top: 0; left: 0; z-index: -1; transform: translateX(-20%);  }
            }
            .word_box { width: 100%; height: auto; margin-top: 0.5rem; background: #f7f7f7; border-radius: 0.2rem; overflow: hidden;
                .item_box { width: 100%; height: auto; .flex; position: relative; z-index: 1;
                    &::after { content:''; position: absolute; bottom: 0; right: 0; width: 100%; height: 1px; background: #ececec; .dh; }
                    .item { flex: 1; height: 0.88rem; min-height: 50px; .flex; .a_center; .j_center; font-size: var(--font24); position: relative; z-index: 1;  cursor: pointer; .dh; font-weight: 500; 
                        &::before { content:''; position: absolute; bottom: 0; right: 0; width: 1px; height: 100%; background: #ececec; .dh; }
                        &::after { content:''; position: absolute; bottom: 0; right: 0; width: 100%; height: 0.05rem; background: var(--active_color2); .dh; opacity: 0; }
                        &:last-child { &::before { opacity: 0; } }
                        &.active { color: var(--active_color2);&::after {  opacity: 1; } }
                        &:hover { color: var(--active_color2); }
                    }
                }
                .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; 
                    ul li { width: 100%; height: auto; 
                        .centerInfo { width: 100%; height: auto; padding: 0.51rem; .a_center; padding-left: 1rem;
                            .tY50 { transform: translateY(50px); opacity: 0; }
                            .left_box { width: 31%; padding: 0.3rem 0;
                                .icon { width: 0.66rem; height: 0.66rem; }
                                .t1 { width: 100%; height: auto;  margin-top: 0.3rem; }
                                .t2 { width: 100%; height: auto;  margin-top: 0.3rem; line-height: 2; color: #999999; }
                                .idx_more { width: 100%; height: auto;  margin-top: 0.7rem; }
                            }
                            .right_box { width: 59.4%;
                                .img { width: 100%; height: auto; .pb { padding-bottom: 64%; } }
                            }
                        }
                        &.swiper-slide-active {
                            .tY50 { transform: translateY(0); opacity: 1; .dh(0.7); }
                        }
                    }
                }
                @media @max990 {
                    .item_box { display: grid; grid-template-columns: repeat(2, 1fr); 
                        .item { font-size: var(--font16); }
                    }
                    .swiper_box ul li .centerInfo { padding-left: .51rem; }
                }
            }
        }
    }
}
.ins_solveCon2 { width: 100%; height: auto; position: relative; z-index: 1; padding-top: 1.2rem; padding-bottom: 1.3rem; 
    background-image: url(../images/bg2.jpg); background-repeat: no-repeat; background-color: #f5f5f5; background-size: cover;
    .center_box { width: 100%; height: auto; 
        .ins_title { text-align: center; .t2 { font-weight: 300; color: #555555; margin-top: 0.1rem; } }
        .content { width: 100%; height: auto; margin: 0 auto; margin-top: 0.4rem; max-width: 72.5%;
            .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.3rem; 
                .item { width: 100%; height: 0.63rem; min-height: 40px; background: #FFFFFF;  border: 1px solid #e4e4e4; border-radius: 100px; padding: 0 0.3rem; .flex; .a_center; font-size: var(--font14); gap: 0.05rem; .j_justify;
                    span { flex-shrink: 0; color: #999999; }
                    img { flex-shrink: 0; max-width: 1.17rem; max-height: 0.63rem; }
                    input , select { width: 100%; height: 100%; border: 0; background: none; }
                    button { width: 100%; height: 100%; background: none; border: 0; color: #FFFFFF; font-weight: 500; font-size: var(--font16); cursor: pointer; }
                    &.button { background: var(--active_color2); border-color: var(--active_color2); cursor: pointer; }
                    .layui-form-select { width: 100%; height: 100%; .flex; .a_center; font-weight: 500;  }
                    .layui-select-title { width: 100%; height: 100%; box-shadow: unset !important; }
                    .layui-input:focus, .layui-textarea:focus { border: unset !important;  box-shadow: unset !important; }
                    .layui-form-select dl { top: 100%; }
                }
            }
            @media @max990 { max-width: 100%; 
                .item { width: 100%; height: auto; }
            }
        }
    }
}
.ins_solvedCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .img_bg { width: 100%; height: auto; img { width: 100%; height: auto; &.wap { min-height: 500px; width: 100%; height: 100%; object-fit: cover; } } }
    .center_box { width: 100%; height: auto; position: absolute; z-index: 5; top: 2.1rem; text-align: center; color: #FFFFFF; 
        .word .t2 { margin-top: 0.2rem; }
    }
}
.ins_solvedCon2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; background: #faf6f7;
    .center_box { width: 100%; height: auto; .flex; .j_justify; .a_center;
        .ins_title { width: 35%; height: auto; 
            .t2 { width: 100%; height: auto; margin-top: 0.15rem; }
        }
        .img { width: 50%; height: auto; margin-top: 0.5rem; }
        @media @max990 {
            .ins_title { max-width: 100%; }
        }
    }
}
.ins_solvedCon3 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.1rem;  padding-bottom: 1rem;
    .center_box  { width: 100%; height: auto; 
        .top_box { width: 100%; height: auto; .flex; .j_justify; .a_center; 
            .pagerSwiper .btnSwi { width: 0.46rem; height: 0.46rem; border: 1px solid #cfcfcf; 
                i { font-size: var(--font14); color: #000; } 
                &:hover { border-color: var(--active_color2); i { color: #FFFFFF; } }
            }
        }
        .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.7rem; overflow: hidden; 
            ul li { width: 32%; height: auto;
                .centerInfo { width: 100%; height: 100%; background: #f2f2f2; padding: 0.55rem 0.6rem; .flex; .a_center; .j_center; .f_column; text-align: center; border-radius: 0.15rem; cursor: pointer; .dh; position: relative; z-index: 1; overflow: hidden;
                    &::after { content:''; position: absolute;  width: 100%; height: 0%; background: var(--active_color2); .dh; top: 0;  left: 0; z-index: -1; border-bottom-right-radius: 100%; border-bottom-left-radius: 100%; }
                    .icon { width: 0.93rem; height: 0.93rem; .flex; .a_center; .j_center; background: var(--active_color2); border-radius: 50%; .dh;
                        img {  filter: brightness(0) invert(1); width: 0.46rem; .dh; }
                    }
                    .word { width: 100%; height: auto; margin-top: 0.3rem;
                        .t1 { font-weight: 600; color: var(--active_color2); .dh; }
                        .t2 { margin-top: 0.3rem; .dh; }
                    }
                    &:hover { 
                        &::after { height: 100%; border-radius: 0; }
                        .icon { background: #FFFFFF; img { filter: unset; } }
                        .word {
                            .t1 { color: #FFFFFF; }
                            .t2 { color: #FFFFFF; }
                        }
                    }
                }
            }
        }
    }
}
@keyframes grow4 { 0% { transform: rotate(0); width: 6.48rem; height: 6.48rem; opacity: 1; } 100% { transform: rotate(360deg); width: 30rem; height: 30rem; opacity: 0.5; } }
@keyframes grow5 { 0% { transform: rotate(0); width: 1rem; height: 1rem;  opacity: 1; } 100% { transform: rotate(360deg); width: 20rem; height: 20rem; opacity: 0.5; } }
@keyframes grow6 { 0% { transform: scale(0); opacity: 0.7; } 100% { transform: scale(2.3); opacity: 0; }}
.ins_solvedCon4 { width: 100%; height: 240vh; position: relative; z-index: 1; overflow: hidden; 
    .maskBox { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; 
        background: url(../images/bg3.jpg) no-repeat; background-size: cover;
        .content { width: 100%; height: calc(100vh - var(--header-height)); position: absolute; bottom: 0; left: 0; 
            .center_box { width: 100%; height: 100%; }
        }
        .content1 { z-index: 1; .flex; .a_center; .j_center; pointer-events: none;
            .center_box { .flex; .a_center; .j_center; padding-top: var(--header-height); }
            .img { width: 34%; position: relative; z-index: 2; .pb {  padding-bottom: 109%; } }
            .svgBox { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; .flex; .a_center; .j_center;
                .bgBox { width: 6.48rem; height: 6.48rem; border-radius: 50%; background: var(--active_color2); position: relative; z-index: 2; }
                .line { width: 4rem; height: 4rem; position: absolute; border-radius: 50%; border: 1px solid #e6e6e6;  animation: grow4 15s linear infinite; z-index: 1;
                    &::after { content:''; position: absolute;  width: 0.08rem; height: 0.08rem; background: #d3d3d3; .dh; left: 0; top: 50%; transform: translateX(-50%); border-radius: 50%; }
                    &::before { content:''; position: absolute;  width: 0.08rem; height: 0.08rem; background: #d3d3d3; .dh; right: 0; top: 50%; transform: translateX(50%); border-radius: 50%;  }
                    &.line2 { animation: grow5 15s linear infinite; }
                }
            }
        }
        .content2 { .flex; .a_center; .j_center; z-index: 3; .dh(0.7);
            .center_box { width: 100%; height: 100%; .flex; .j_center; .f_column;
                .title  { position: absolute; font-weight: 600; top: 0.2rem; left: 0; }
                .contBox { width: 100%; height: auto; .flex; .j_justify; .a_center; margin-top: 0.8rem; }
                .item_box { width: fit-content; .flex; .f_column; gap: 0.6rem;
                    .item { width: fit-content; height: auto; min-width: 2rem; background: var(--bg); line-height: 1; padding: 0.2rem 0.34rem; border-radius: 100px; color: var(--color); .flex; .a_center; .j_center; gap: 0.1rem; transform: translateX(0); position: relative; z-index: 1; font-size: var(--font18); font-weight: 500;
                        img { filter: var(--fit); }
                    }
                    &:last-child { .a_end; }
                }
            }
            &.active { opacity: 0; z-index: 2; transform: translateY(-1rem); }
        }
        .content3 { .flex; .a_center; .j_center; z-index: 2; opacity: 0; .dh(0.7); transform: translateY(1rem); 
            .center_box { width: 100%; height: 100%; .flex; .j_center; .f_column;
                .title  { position: absolute; font-weight: 600; top: 0.2rem; left: 0; }
                .contBox { width: 100%; height: auto; .flex; .j_justify; .a_center;
                    .item { width: 3.5rem; background: #FFFFFF; padding: 0.3rem; border-radius: 0.2rem; padding-bottom: 0.75rem;  position: relative; z-index: 1;
                        .img { width: 100%; height: auto; .pb { padding-bottom: 80%; border-radius: 0.2rem; .ab img { width: 100%; height: 100%; object-fit: cover; } } }
                        .word { width: 100%; height: auto; margin-top: 0.5rem; line-height: 1.38; font-weight: 500; 
                            .t1 { font-weight: 600; color: var(--active_color2); }
                        }
                        .number { position: absolute; width: fit-content; height: auto; bottom: 0; right: 0; font-size: 1.8rem;  font-weight: 600; line-height: 1; .te_gra; z-index: -1; }
                        .line { position: absolute; width: 0; height: 0; z-index: 2; top: 0.52rem; right: 0; .flex; .a_center; .j_center;
                            i { width: 0.12rem; height: 0.12rem; position: absolute; background: var(--active_color2); border-radius: 50%; z-index: 5; }
                            &::after { content:''; position: absolute;  width: 0.2rem; height: 0.2rem; background: var(--active_color2); .dh; opacity: 0.3; z-index: 1; border-radius: 50%;  animation: grow6 5s linear infinite; }
                            &::before { content:''; position: absolute;  width: 0.2rem; height: 0.2rem; background: var(--active_color2); .dh; opacity: 0.3; z-index: 1; border-radius: 50%; animation: grow6 3s linear infinite; }
                        }
                        &:nth-child(2n){
                            .line { left: 0 !important; }
                        }
                    }
                }
            }
            &.active { opacity: 1; z-index: 3; transform: translateY(0); }
        }
    }
    @media @max990 { width: 100%; height: auto; 
        .maskBox { width: 100%; height: auto; position: relative; z-index: 1; .flex; .f_column; padding-bottom: 0.5rem;
            .content { width: 100%; height: auto; position: relative; z-index: 1; }
            .content1 { order: 2; 
                .svgBox { display: none; }
                .center_box { padding-top: 0; padding: 0.8rem 0; } 
            }
            .content2 { order: 1; }
            .content3 { order: 3; 
                .center_box .contBox { .a_start; gap: 0.3rem; }
            }

            .content2 .center_box { padding-top: 0.5rem;
                .title { width: 100%; height: auto; position: relative; z-index: 1;  }
                .contBox { width: 100%; height: auto; gap: 0.4rem; }
                .item_box { width: 100%; height: auto; gap: 0.5rem;
                    .item { width: 100%; height: auto; font-size: 12px; .j_start; background: #FFFFFF; color: #333333;
                        img { width: 15px; filter: brightness(0) invert(0); }
                    }
                }
                // .contBox { width: 100%; height: auto; .flex; .f_column; }
                // .item_box { margin-top: 0.2rem; display: grid; grid-template-columns: repeat(2, 1fr); } 
            }
            .content3 { opacity: 1; transform: translateY(0); 
                .center_box .contBox .item .word {
                    .t1 { font-size: var(--font24); }
                    .t2 { font-size: var(--font20); }
                }
            }
        }
    } 
}
.ins_solvedCon5 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    background-image: url(../images/bg4.jpg); background-repeat: no-repeat; background-size: cover; background-position: top center;
    .center_box { width: 100%; height: auto; 
        .ins_title .t1 { color: #FFFFFF; }
        .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(5, 1fr); gap:0.4rem 0.65rem; margin-top: 0.8rem;
            .item { width: 100%; height: auto; 
                .img { width: 100%; height: auto; border-radius: 150px; position: relative; z-index: 1; .flex; .a_center; .j_center; overflow: hidden; border: 0.1rem solid #FFFFFF;
                    .pb {  border-radius: 50%; .ab img { width: 100%; height: 100%; object-fit: cover; } } 
                }
                .word { width: 100%; height: auto;  margin-top: 0.25rem; font-size: var(--font20); text-align: center; }
            }
        }
    }
    @media @max990 {
        .center_box .item_box  { display: grid; grid-template-columns: repeat(3, 1fr); }
    }
}
.ins_solvedCon6 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    .top_box { width: 100%; height: auto; .flex; .j_justify; 
        .pagerSwiper { width: fit-content; 
            .btnSwi { border-width: 1px; i { color: #000000; font-size: var(--font28); } }
        }
    }
    .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; margin-top: 0.8rem;
        ul li { width: auto; height: auto; 
            .centerInfo { width: 100%; height: auto; text-align: center;
                .img { width: 100%; height: auto; .pb { padding-bottom: 139%; .ab { .flex; .a_center; .j_center; img { .dh; } } } }
                .word { width: 100%; height: auto; margin-top: 0.24rem; padding: 0 0.25rem; color: #000000; }
            }
        }
    }
}
.ins_solvedCon7 { width: 100%; height: auto;  position: relative; z-index: 1; overflow: hidden; 
    .center_box { width: 100%; height: auto; position: absolute; z-index: 5; top: 1.2rem; left: 0; 
        .ins_title .t1 { color: #FFFFFF; }
    }
    .swiper_info { width: 100%; height: auto; position: relative; z-index: 1; .flex; .a_center; .j_center; background: #000000;
        .btnSwi { width: 0.5rem; height: 0.5rem; min-width: 38px; min-height: 38px; .flex; .a_center; .j_center; background: #ffffff66; border-radius: 50%; .dh; cursor: pointer; position: absolute; z-index: 5; right: 0.9rem;
            i { color: #FFFFFF; .dh; font-size: var(--font22); }
            &:hover { background: var(--active_color2); border-color: var(--active_color2); i { color: #FFFFFF !important; } }
            &.prev { left: 0.9rem; }
        }
        .swiper_box { width: 100%; height: auto; position: relative; z-index: 1;
            ul li { width: auto; height: auto; 
                .centerInfo { width: 100%; height: auto; position: relative; z-index: 1;
                    .word { position: absolute; bottom: 0.4rem; z-index: 5; width: 100%; height: auto; color: #FFFFFF; text-align: center; font-size: var(--font24); }
                    .img { width: 100%; height: calc(100vh - var(--header-height)); overflow: hidden; img { width: 100%; height: 110vh; max-width: unset; max-height: unset; object-fit: cover; } }
                }
            }
        }
    }
    @media @max990 {
        .swiper_info .swiper_box ul li .centerInfo .img { height: auto; img { width: 100%; height: auto; min-height: 500px; } }
    }
}
.ins_solvedCon8 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    .center_box { width: 100%; height: auto; 
        .content { width: 100%; height: auto; margin-top: 0.7rem; 
            .title { width: 100%; height: auto; }
            table { width: 100%; height: auto; border-color: #e7e7e7; text-align: center; table-layout: fixed; word-break: break-all; word-wrap: break-word; min-width: 900px; margin-top: 0.4rem;
                thead { background: #dcdcdc;  td { height: 60px; font-size: var(--font16); font-weight: 600; } }
                tbody { width: 100%; height: auto; 
                    td { padding: 0.2rem; font-size: var(--font14); color: #666666; font-weight: 300;  }
                }
                td { position: relative; z-index: 1; cursor: pointer; 
                    &.active { color: #FFFFFF;  .dh; background: var(--active_color2); transform: scale(1.2); border-radius: 0.1rem; }
                    &:hover { color: #FFFFFF;  .dh; background: var(--active_color2); transform: scale(1.2); border-radius: 0.1rem; }
                }
            }
            @media @max990 { overflow: auto; }
        }
    }
}
.ins_solvedCon9 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; background: #f8f8f8;
    .center_box { width: 100%; height: auto; 
        .top_box { width: 100%; height: auto; .flex; .j_justify; 
            .pagerSwiper { width: fit-content; 
                .btnSwi { border-width: 1px; i { color: #bbbbbb; font-size: var(--font28); } }
            }
        }
        .swiper_box { width: 100%; height: auto; margin-top: 0.6rem; overflow: hidden;
            ul li { width: auto; height: auto; 
                .item { width: 100%; height: auto; cursor: pointer; background: #FFFFFF;
                    .img { width: 100%; height: auto; position: relative; z-index: 1; .pb { padding-bottom: 69%; .ab img { width: 100%; height: 100%; object-fit: cover; .dh; } } }
                    .word { width: 100%; height: auto; padding: 0.34rem; padding-top: 0.7rem; position: relative; z-index: 2;
                        .icon { position: absolute; top: 0; transform: translateY(-50%); left: 0.34rem; width: 0.9rem; height: 0.9rem; border-radius: 50%; border: 0.1rem solid #f8f8f8; }
                        .t1 { width: 100%; .text(1); line-height: 1.6; font-weight: 500; max-width: 80%; .dh; }
                        .t2 { width: 100%;  height: calc(3em * 1.625); .text(3); margin-top: 0.1rem; line-height: 1.625; color: var(--color_666); }
                        .t3 { width: 100%; height: auto; margin-top: 0.55rem; color: #999999;  .flex; .j_justify; line-height: 1; .a_center; }
                    }
                    &:hover  {
                        .img .pb .ab img { transform: scale(1.05); }
                        .word .t1 { color: var(--active_color2); }
                    }
                }
            }
        }
    }
}
.ins_solvedCon10 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.1rem;  padding-bottom: 1rem;
    .center_box  { width: 100%; height: auto; 
        .top_box { width: 100%; height: auto; .flex; .j_justify; .a_center; 
            .pagerSwiper .btnSwi { width: 0.46rem; height: 0.46rem; border: 1px solid #cfcfcf; 
                i { font-size: var(--font14); color: #000; } 
                &:hover { border-color: var(--active_color2); i { color: #FFFFFF; } }
            }
        }
        .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.7rem; 
            // &::after { content:''; position: absolute;  width: 100%; height: 100%; background: #FFF; .dh; top: 0; right: 100%; z-index: 10; }
            ul li { width: 32%; height: auto;
                .centerInfo { width: 100%; height: 100%; border: 2px solid #f2f2f2; padding:0.6rem 0.3rem; padding-bottom: 0.4rem; cursor: pointer; .dh; position: relative; z-index: 1; overflow: hidden;
                    &::after { content:''; position: absolute;  width: 100%; height: 0%; background: var(--active_color2); .dh; top: 0;  left: 0; z-index: -1; border-bottom-right-radius: 100%; border-bottom-left-radius: 100%; }
                    &::before { content:''; position: absolute; bottom: 0; right: 0; width: 100%; height: 0.05rem; background: var(--active_color); .dh(0.6); }
                    .icon { width: 0.43rem; height: 0.43rem; .flex; .a_center; .j_center;  }
                    .word { width: 100%; height: auto; margin-top: 0.3rem;
                        .t1 { font-weight: 600; .dh; }
                        .t2 { margin-top: 0.3rem; .dh; line-height: 1.875; .flex; .f_column; gap: 0.3rem; 
                            p { position: relative; z-index: 1; padding-left: 0.14rem; 
                                &::after { content:''; position: absolute;  width: 0.05rem; height: 0.05rem; background: #c1c1c1; .dh; top: 0.7em; left: 0; border-radius: 50%; }
                            }
                        }
                    }
                    &:hover { 
                        &::after { height: 100%; border-radius: 0; }
                        &::before {  background: #bdde95; }
                        .icon { img { filter: brightness(0) invert(1); } }
                        .word {
                            .t1 { color: #FFFFFF; }
                            .t2 { color: #FFFFFF; p::after { background: #FFFFFF; } }
                        }
                    }
                }
            }
        }
    }
}
.ins_solvedCon11 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    .top_box { width: 100%; height: auto; .flex; .j_justify; 
        .pagerSwiper { width: fit-content; 
            .btnSwi { border-width: 1px; i { color: #000000; font-size: var(--font28); } }
        }
    }
    .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; margin-top: 0.5rem;
        ul li { width: auto; height: auto; 
            .centerInfo { width: 100%; height: auto; text-align: center;
                .img { width: 100%; height: auto; .pb { padding-bottom: 68%; .ab { .flex; .a_center; .j_center; img { width: 100%; height: 100%; object-fit: cover; .dh; } } } }
                .word { width: 100%; height: auto; margin-top: 0.24rem; padding: 0 0.25rem; color: #000000; font-size: var(--font18); }
            }
        }
    }
}


@keyframes grow7 { 100% { transform: rotate(360deg); } }
.ins_caseCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 0.96rem 0;
    .center_box { width: 100%; height: auto; 
        .item_box { width: 100%; height: auto; .flex; .f_column; gap: 0.9rem; 
            .item { width: 100%; height: auto; .a_end;
                .left_box { width: 62%; height: auto; 
                    .img { width: 100%; height: auto; overflow: hidden; position: relative; z-index: 1;
                        img { width: 100%; height: auto; } 
                        &::after { content:''; position: absolute;  width: 100%; height: 100%; background: #FFF; z-index: 2; .dh(0.7); top: 0; left: 0; }
                    }
                }
                .right_box { width: 32%; padding-bottom: 0.65rem; 
                    .word { width: 100%; height: auto; 
                        .t1 { font-weight: 600; }
                        .icon { width: fit-content; height: auto;  margin-top: 0.3rem; font-size: var(--font20); .flex; .a_center; gap: 0.1rem; }
                    }
                }
                &:nth-child(2n) { .f_row_right;
                    .word { text-align: end; .flex; .f_column; .a_end; }
                    .left_box .img::after { left: unset; right: 0; }
                }
                &.active {
                    .left_box .img::after { width: 0%; }
                }
                @media @max990 { flex-direction: column !important; }
            }
        }
        .downBox  { width: 100%; height: auto; .flex; .f_column; .a_center; margin-top: 1.2rem;
            .icon {  animation: grow7 5s cubic-bezier(1, 0.36, 0.08, 0.4) infinite; }
            .word { margin-top: 0.25rem; color: #999999; }
        }
    }
}
.ins_caseCon2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-bottom: 1.8rem; 
    .center_box { width: 100%; height: auto; 
        .ins_title { width: 100%; height: auto; text-align: center; }
        .list_box { width: 100%; height: auto; .flex; .a_center; .j_center; gap: 4px; margin-top: 0.34rem; 
            .item { width: fit-content; padding: 0.1rem 0.28rem; line-height: 1; background: #f2f2f2; color: #999999; cursor: pointer; .dh;
                &:hover { color: var(--active_color2); }
                &.active { background: var(--active_color2); color: #FFFFFF; }
            }
        }
        .item_box { width: 100%; height: auto; gap: 0.5rem 0.2rem; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 0.45rem;
            .item { width: 100%; height: auto; cursor: pointer;
                .img { width: 100%; height: auto; position: relative; z-index: 1; .flex; .a_center; .j_center; border-radius: 0.15rem; overflow: hidden;
                    .pb { padding-bottom: 68%; .ab img { .dh; } }
                    .icon { position: absolute; width: 0.42rem; height: 0.42rem; z-index: 6; }
                }
                .word { width: 100%; height: auto; text-align: center; margin-top: 0.2rem; }
                &:hover {
                    .img .pb .ab img { transform: scale(1.03); }
                }
            }
        }
        .downBox  { width: 100%; height: auto; .flex; .f_column; .a_center; margin-top: 1.2rem;
            .icon {  animation: grow7 5s cubic-bezier(1, 0.36, 0.08, 0.4) infinite; }
            .word { margin-top: 0.25rem; color: #999999; }
        }
    }
    @media @max990 {
        .center_box {
            .list_box { display: grid; grid-template-columns: repeat(4, 1fr); 
                .item { width: 100%; height: 100%; .flex; .a_center; .j_center; }
            }
            .item_box { display: grid; grid-template-columns: repeat(2, 1fr); }
        }
    }
}


.ins_serviceCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .flex; .a_center; .j_center;
    .center_box { width: 100%; height: auto; position: absolute; z-index: 2; 
        .word { width: 100%; height: auto; 
            .t1 { color: #ffffff; }
            .t2 { margin-top: 0.2rem; color: #ffffff; }
            .co000 { color: #000; }
        }
    }
    .item_box { width: 100%; height: auto; position: absolute; bottom: 0; left: 0; .flex; .a_center; .j_center; gap: 2rem; background: #00000080;
        .item { width: fit-content; height: 0.66rem; min-height: 40px; color: #FFFFFF; .flex; .a_center; .j_center; position: relative; z-index: 1; .dh; cursor: pointer;
            &::after { content:''; position: absolute; bottom: 0; right: 0; width: 0%; height: 2px; background: var(--active_color2); .dh; }
            &.active { color: var(--active_color2); &::after { width: 100%; } }
            &:hover { color: var(--active_color2); }
        }
        &.gap50 { gap: 1rem; }
    }
    .img_w100 { width: 100%; height: auto; img { width: 100%; height: auto; &.wap { min-height: 500px; width: 100%; height: 100%; object-fit: cover; } } }
    @media @max990 {
        .item_box { display: none; }
    }
}

@keyframes grow8 { 100% { transform: rotate(-360deg); } }
.ins_serviceCon2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0;
    background: url(../images/bg6.jpg) no-repeat; background-attachment: fixed; background-position: top left;
    .center_box  { width: 100%; height: auto; 
        .ins_title { text-align: center; }
        .content { width: 100%; height: 9.3rem; .flex; .a_center; .j_center; margin-top: 1.2rem;
            .icon_box { width: 100%; height: 100%; .flex; .a_center; .j_center;
                .lineBox { width: 5.62rem; height: 5.62rem; position: absolute; border: 1px solid #d6d6d677; border-radius: 50%; 
                    animation: grow8 50s linear infinite;
                    .on { position: absolute; width: 0; height: 0; .flex; .a_center; .j_center; 
                        img { width: 0.2rem; max-width: unset; max-height: unset; }
                        &.top { top: 0; left: 50%; }
                        &.right { top: 50%; right: 0%; img { transform: rotate(90deg);}}
                        &.bottom { top: 100%; left: 50%; img { transform: rotate(180deg);}}
                        &.left { top: 50%; right: 100%; img { transform: rotate(-90deg);}}
                    }
                }
                .img_box { width: 4.67rem; height: 4.67rem; background: #FFFFFF; border-radius: 50%; .flex; .a_center; .j_center;
                    .img { width: 3.66rem; height: 3.66rem; animation: grow7 50s linear infinite; img { width: 100%; height: auto; } }
                    .word { position: absolute; width: 2rem; height: 2rem; .flex; .a_center; .j_center; .f_column; font-size: var(--font36); font-weight: 600; line-height: 1.2;  .ic { color: var(--active_color2); } }
                }
            }
            .item_box { width: 9.3rem; height: 9.3rem; position: absolute; border-radius: 50%; border: 1px solid #d6d6d677;
                .item { width: 0; height: 0; .flex; .a_center; .j_center; position: absolute;
                    .word_box { width: max-content; max-width: 3.5rem; height: auto; position: absolute; top: 0; left: 0; transform: translateY(-0.8rem) translateX(-50%); .flex; .a_center; .j_center; .f_column; 
                        .icon { width: 1.58rem; height: 1.58rem; min-width: 100px; min-height: 100px; background: #FFF; border-radius: 50%; .flex; .a_center; .j_center; .f_column; font-size: var(--font26); font-weight: 600; line-height: 1.2; border: 1px solid #d6d6d677; 
                            p:first-child { position: relative; z-index: 1; line-height: 1.48; 
                                &::after { content:''; position: absolute;  width: 0.21rem; height: 0.21rem; background: var(--active_color2); .dh; border-radius: 50%; top: 0; left: 0; z-index: -1; transform: translateX(-20%);  } 
                            }
                            p:last-child { position: relative; z-index: 1; line-height: 1.48; 
                                &::after { content:''; position: absolute;  width: 0.21rem; height: 0.21rem; background: var(--active_color2); .dh; border-radius: 50%; top: 0; left: 0; z-index: -1; transform: translateX(-20%); opacity: 0; } 
                            }
                        }
                        .word { text-align: center; font-size: var(--font18); margin-top: 0.2rem; }
                    }
                    &.right .word_box .icon p:first-child::after { left: unset; right: -0.1rem; }
                    &.bottom .word_box .icon p:last-child::after { left: unset; right: -0.1rem; opacity: 1; }
                    &.bottom .word_box .icon p:first-child::after { opacity: 0; }
                    &.left.bottom .word_box .icon p:last-child::after { right: unset; left: 0; }
                }
            }
            @media @max990 { width: 100%; height: auto; position: relative; z-index: 1;  .f_column;
                .item_box { width: 100%; height: auto; position: relative; z-index: 1; border: 0; border-radius: 0; display: grid; grid-template-columns: repeat(1, 1fr); gap: 0.2rem;
                    .item { width: 100%; height: auto; position: relative; z-index: 1; top: unset !important; left: unset !important; .j_start; .a_start; 
                        background: #FFF; border: 1px solid #d6d6d677;  border-radius: 0.16rem; padding: 0.4rem;
                        .word_box { width: 100%; height: auto; position: relative; z-index: 1;  max-width: unset !important; transform: unset !important;  .a_start;
                            .icon { width: 100%; height: auto; border-radius: 0; padding: 0;  border: 0; .f_row; .j_start; min-width: unset; min-height: unset; position: relative; z-index: 1;
                                &::after { content:''; position: absolute;  width: 0.21rem; height: 0.21rem; background: var(--active_color2); .dh; border-radius: 50%; top: 0; left: 0; z-index: -1; transform: translateX(-20%); } 
                                p { width: auto; height: auto; 
                                    &::after { opacity: 0 !important; }
                                }
                            }
                            .word { text-align: left; margin-top: 0; }
                        }
                    }
                }
            }
        }
    }
}
.ins_serviceCon3 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1rem 0; 
    .center_box { width: 100%; height: auto; 
        .item_box { width: 100%; height: auto; margin-top: 0.4rem; .flex; .f_column; gap: 0.15rem;
            .item { width: 100%; height: auto; background: #f6f6f6; padding: 0.2rem;
                .top { width: 100%; height: auto; .flex; .j_justify; .a_center; cursor: pointer; gap: 0.2rem;
                    .word { width: fit-content; .flex; .a_center; gap: 0.2rem; color: #666666; font-size: var(--font18);
                        i { font-style: unset; width: 0.32rem; height: 0.32rem; .flex; .a_center; .j_center; background: var(--active_color2); border-radius: 50%; color: #FFFFFF; min-width: 25px; min-height: 25px; } 
                    }
                    .icon { width: 20px; height: 20px;
                        i { color: #000; font-size: var(--font12); }
                    }
                }
                .bot { width: 100%; height: auto; margin-top: 0.26rem; display: none;
                    .icon_box { width: 100%; height: auto; .flex; gap: 0.2rem; }
                    .icon { font-style: unset; width: 0.32rem; height: 0.32rem; .flex; .a_center; .j_center; background: var(--active_color); border-radius: 50%; color: #FFFFFF;  min-width: 25px; min-height: 25px; } 
                    .word { width: fit-content; .flex; .a_center; gap: 0.2rem; color: #666666; line-height: 1.8; font-size: var(--font16); }
                }
            }
        }
        .layPager { width: 100%; height: auto; margin-top: 0.8rem; }
    }
}
.ins_serviceCon4 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-bottom: 0.8rem;
    .center_box { width: 100%; height: auto; 
        .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; margin-top: 0.7rem;
            .item { width: 100%; height: auto; cursor: pointer;
                .img { width: 100%; height: auto;  .pb { padding-bottom: 111%; .ab { .flex; .a_center; .j_center; } } }
                .word { width: 100%; height: auto; text-align: center; margin-top: 0.2rem; 
                    .t1 { color: #222222; }
                    .more { width: 100%; height: auto; margin-top: 0.06rem; color: #999999; .dh; }
                }
                &:hover  {
                    .word .more { color: var(--active_color2); }
                }
            }
            @media @max990 { display: grid; grid-template-columns: repeat(2, 1fr); }
        }
    }
}
.ins_serviceCon5 { width: 100%; height: auto; position: relative; z-index: 1; padding-top: 0.9rem; padding-bottom: 0.8rem; 
    background-image: url(../images/zz55.jpg); background-repeat: no-repeat; background-color: #f5f5f5; background-size: cover;
    .center_box { width: 100%; height: auto; color: #FFFFFF;
        .left_box { max-width: 45%; width: fit-content; height: auto; 
            .t1 { font-weight: 600; }
            .t2 { width: 100%; height: auto; margin-top: 0.2rem; }
            .idx_more { width: 100%; height: auto; margin-top: 0.5rem; }
        }
        .right_box { max-width: 45%; width: fit-content; height: auto; text-align: end; 
            .t2 { font-weight: 500; margin-top: 0.15rem; }
        }
        @media @max990 {
            .left_box { max-width: unset; }
            .right_box { max-width: unset; text-align: left; }
        }
    }
}
.ins_casedCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0;
    background-image: url(../images/zz56.jpg); background-color: #f5f5f5; background-size: cover; background-attachment: fixed;
    .center_box { width: 100%; height: auto; position: relative; z-index: 1;
        .left_box { width: 36.5%; height: auto; 
            .t1 { font-weight: 600; color: var(--active_color2); line-height: 1.2; }
            .t2 { font-weight: 500; line-height: 1.2; margin-top: 0.2rem; }
            .cont { width: 100%; height: auto; margin-top: 0.4rem;
                .t3 { color: var(--active_color2); }
                .t4 { width: 100%; height: auto; margin-top: 0.15rem; line-height: 1.875; color: #666666; }
            }
            .idx_more { width: 100%; height: auto; margin-top: 0.7rem;  .more { .flex; .a_center; .j_center; gap: 0.1rem; padding: 0 0.2rem; } }
        }
        .right_box { width: 48%; height: auto; 
            .swiper_box  { width: 100%; height: auto; 
                ul li { width: 100%; height: auto; 
                    .centerInfo { width: 100%; height: auto; .a_center;
                        .img { width: 100%; height: auto; .pb { padding-bottom: 76%; .ab img { width: 100%; height: 100%; object-fit: cover; } } }
                    }
                }
            }
            .idxPageShow { width: 48%; position: absolute; right: 0; bottom: 0; z-index: 5; padding-bottom: 0.2rem; 
                .swiper-pagination-bullet-active { background: #FFFFFF; border: 1px solid #FFF; }
            }
        }
    }
}
.ins_casedCon2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0;
    .center_box { width: 100%; height: auto; position: relative; z-index: 1;
        .right_box { width: 43%; height: auto; padding-top: 0.3rem; padding-bottom: 1.2rem;
            .t1 { font-weight: 600; line-height: 1.333; 
                p { width: fit-content; }
                p:last-child { position: relative; z-index: 1; 
                    &::after { content:''; position: absolute; bottom: 0; right: 0; width: 100%; height: 0.1rem; transform: translateY(-0.15em); z-index: -1;  background: var(--active_color2); line-height: 1; .dh; }
                }
            }
            .t2 { font-weight: 500; line-height: 1.2; margin-top: 0.2rem; }
            .cont { width: 100%; height: auto; margin-top: 0.4rem;
                .t3 { color: var(--active_color2); }
                .t4 { width: 100%; height: auto; margin-top: 0.15rem; line-height: 1.875; color: #666666; }
            }
            .idx_more { width: 100%; height: auto; margin-top: 0.7rem;  .more { .flex; .a_center; .j_center; gap: 0.1rem; padding: 0 0.2rem; } }
        }
        .left_box { width: 49.2%; height: auto; 
            .swiper_box  { width: 100%; height: auto; 
                ul li { width: 100%; height: auto; 
                    .centerInfo { width: 100%; height: auto; 
                        .img { width: 100%; height: auto; .pb { padding-bottom: 73%; .ab img { width: 100%; height: 100%; object-fit: cover; } } }
                    }
                }
            }
        }
        .idxPage { width:  43%; position: absolute; right: 0; bottom: 0; z-index: 5; padding-bottom: 0.3rem; .flex; .a_center; gap: 0.16rem;
            .swiperBtn { background: #dedede; border: 0; 
                i { font-size: var(--font14); color: #000000; } 
                &:hover i  { color: #FFFFFF; }
            }
        }
        @media @max990 {
            .idxPage { display: none; }
            .swiper_box ul li .centerInfo .right_box { padding-bottom: 0; }
        }
    }
}
.ins_casedCon3 { width: 100%; height: auto; position: relative; z-index: 1; padding-top: 2.1rem; padding-bottom: 1.8rem; 
    background-image: url(../images/zz59.jpg); background-repeat: no-repeat; background-color: #f5f5f5; background-size: cover;
    .center_box { width: 100%; height: auto; 
        .t1 { font-weight: 600; }
        .t2 { font-weight: 500; font-style: italic; margin-top: 0.45rem; span { display: contents; color: var(--active_color2); } }
        .idx_more { width: 100%; height: auto; margin-top: 0.9rem; }
    }
}
.ins_aboutCon1 { width: 100%; height: auto; position: relative; z-index: 1;  overflow: hidden; padding-top: 1.2rem; padding-bottom: 0.5rem;
    background-image: url(../images/bg7.jpg); background-color: #f5f5f5; background-size: cover; 
    .center_box { width: 100%; height: auto; 
        .ins_tBox { width: 100%; height: auto; .a_center; padding-bottom: 0.75rem; 
            .left_box { width: fit-content; max-width: 35%; 
                .t1 { line-height: 1.3; font-weight: 600; span { display: contents; color: var(--active_color2); } }
                .videoBox { width: fit-content; .flex; .a_center;  gap: 0.1rem; margin-top: 0.45rem; span { color: #999999; }  }
            }
            .right_box { width: 51%; line-height: 2.25; color: #666666; }
        }
        .content { width: 100%; height: auto; .flex; .a_center; .j_center; margin-top: 0.9rem;  position: relative; z-index: 1;
            .title { position: absolute; top: 0; left: 0; font-weight: 600; }
            .graphic_box { width: 9.15rem; height: 9.15rem; border-radius: 50%; .flex; .a_center; .j_center; position: relative; z-index: 1;
                .icon_box { width: 5.8rem; height: 5.8rem; position: relative; z-index: 1; .flex; .a_center; .j_center;
                    .img { width: 100%; height: auto; background: #FFFFFF; border-radius: 50%; img { width: 100%; height: auto; } }
                    .list { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10;
                        .one { width: 0; height: 0; .flex; .a_center; .j_center; position: absolute;
                            span { position: absolute; width: max-content; color: #FFFFFF; font-size: var(--font32); transform: var(--deg); .flex; .a_center; .j_center; padding: 0.2rem; cursor: pointer; }
                        }
                    }
                    .word_box { width: 2.88rem; height: 2.88rem; position: absolute; .flex; .a_center; .j_center; text-align: center;
                        .icon { width: 100%; height: 100%; .flex; .a_center; .j_center; animation: run 100s linear infinite; }
                        .word { width: 80%; height: 80%; position: absolute; .flex; .a_center; .j_center; .f_column; font-weight: 600; line-height: 1.33;
                            span { color: var(--active_color2); }
                        }
                    }
                }
                .item_box { width: 100%; height: 100%; position: absolute; top: 0; left: 0; 
                    .item { width: 100%; height: 100%; position: absolute; top: 0; left: 0; opacity: 0; .dh;
                        &.active { opacity: 1; }
                    }
                }
            }
        }
        @media @max990 {
            .ins_tBox { .a_start; 
                .left_box { max-width: 100%; }
                .right_box { line-height: 1.8; }
            }
            .content{ .f_column; .a_start; gap: 0.5rem;
                .title { position: relative; z-index: 1; }
                .graphic_box { width: 100%; height: auto;
                    .icon_box .word_box { text-align: center; }
                    .item_box { display: none; }
                }
            }
        }
    }
}
.ins_aboutCon2 { width: 100%; height: auto; position: relative; z-index: 1;  overflow: hidden; padding: 1.2rem 0; 
    .center_box { width: 100%; height: auto; 
        .ins_tBox { width: 100%; height: auto; .a_center; padding-bottom: 0.75rem; 
            .left_box { width: fit-content; max-width: 35%; 
                .t1 { line-height: 1.3; font-weight: 600; span { display: contents; color: var(--active_color2); } }
                .videoBox { width: fit-content; .flex; .a_center;  gap: 0.1rem; margin-top: 0.45rem; span { color: #999999; }  }
            }
            .right_box { width: 47%; line-height: 2.25; color: #666666; }
        }
        .img { width: 100%; height: auto; margin-top: 0.6rem; }
        @media @max990 {
            .ins_tBox { .a_start; 
                .left_box { max-width: 100%; }
                .right_box { line-height: 1.8; }
            }
        }
    }
}
.ins_aboutCon3 { width: 100%; height: auto;  position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0;  padding-bottom: 0.6rem;
    background-image: url(../images/bg8.jpg); background-repeat: no-repeat; background-color: #f5f5f5; background-size: cover;
    .center_box { width: 100%; height: auto; 
        .ins_tBox { width: 100%; height: auto; .a_center;
            .left_box { width: fit-content; max-width: 35%; 
                .t1 { line-height: 1.3; font-weight: 600; span { display: contents; color: var(--active_color2); } }
            }
            .right_box { width: 47%; line-height: 2.25; color: #666666; }
        }
        .swiper_info { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.8rem; .flex; .a_center; .j_center;
            .swiper_box { width: 100%; height: auto; overflow: hidden;
                ul li { width: auto; height: auto; 
                    .centerInfo { width: 100%; height: auto; text-align: center;
                        .img { width: 100%; height: auto; .pb { padding-bottom: 94%; .ab img { width: 100%; height: 100%; object-fit: cover; } } }
                        .word { width: 100%; height: auto; margin-top: 0.2rem; }
                    }
                }
            }
            .btnSwi { width: 0.5rem; height: 0.5rem; min-width: 38px; min-height: 38px; .flex; .a_center; .j_center; border: 2px solid #c9c9c9; border-radius: 50%; .dh; cursor: pointer; position: absolute;
                &.next { left: calc(100% + 0.5rem); }
                &.prev { right: calc(100% + 0.5rem); }
                i { color: #cfcfcf; font-weight: 300; .dh; font-size: var(--font22); }
                &:hover { background: var(--active_color2); border-color: var(--active_color2); i { color: #FFFFFF !important; } }
            }
        }
        .idxPageShow { width: 100%; height: auto; margin-top: 0.5rem;
            span { background: #dedede; border: 1px solid #dedede; }
            .swiper-pagination-bullet-active { background: var(--active_color2); border-color: var(--active_color2); }
        }
        @media @max990 {
            .ins_tBox { .a_start; 
                .left_box { max-width: 100%; }
                .right_box { line-height: 1.8; }
            }
        }
    }
}

@keyframes grow9 { 0% { transform: scale(0); opacity: 0.8; } 100% { transform: scale(2); opacity: 0; } }
.ins_aboutCon4 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    .center_box { width: 100%; height: auto; 
        .ins_title { font-weight: 600; }
        .content { width: 100%; height: auto; margin-top: 0.8rem;
            .left_box { width: 73.61%; 
                .images { width: fit-content; height: auto; position: relative; z-index: 1; 
                    .img { width: 100%; height: auto; img { width: 100%; height: auto; } }
                    .item_box { width: 100%; height: 100%; position: absolute; top: 0; left: 0; 
                        .item { width: 0; height: 0; .flex; .a_center; .j_center; position: absolute; cursor: pointer;
                            &::after { content:''; position: absolute; z-index: 2; width: 0.1rem; height: 0.1rem; background: #b1b1b1; .dh; border-radius: 50%; }
                            i { width: 0; height: 0; .flex; .a_center; .j_center; position: relative; z-index: 1;
                                &::after { content:''; position: absolute;  width: 0.2rem; height: 0.2rem; background: #b1b1b1; border-radius: 50%; .dh; opacity: 0.2;  animation: grow9 var(--t1) linear infinite; }
                                &::before { content:''; position: absolute;  width: 0.2rem; height: 0.2rem; background: #b1b1b1; border-radius: 50%; .dh; opacity: 0.2; animation: grow9 var(--t2) linear infinite; }
                            }
                            span { position: absolute; width: max-content; font-size: var(--font14); color: #000; font-weight: 600; .dh; }
                            &.top span { bottom: 0.1rem; } &.bot span { top: 0.1rem; } &.rig span { left: 0.1rem; } &.lef span { right: 0.1rem; }
                            &.active {  &::after { background: var(--active_color2); } span { color: var(--active_color2); }  i::after { background: var(--active_color2); } i::before { background: var(--active_color2); } }
                        }
                    }
                }
            }
            .right_box { width: 26.39%; padding-left: 0.8rem; border-left: 1px solid #efefef; 
                .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden;
                    ul li { width: 100%; height: auto; 
                        .centerInfo { width: 100%; height: auto; 
                            .img_box { width: 100%; height: auto; position: relative; z-index: 1;
                                .img { width: 100%; height: auto; position: relative; z-index: 1; .pb { padding-bottom: 70%; .ab img { width: 100%; height: 100%; object-fit: cover; } } }
                                .woB { position: absolute; z-index: 2; bottom: 0; width: 100%; height: auto; padding: 0.1rem 0.14rem; background:linear-gradient(90deg, #5050cf, #f0f0fb 80%, ); font-size: var(--font16); line-height: 1.23; color: #FFFFFF; }
                            }
                            .list { width: 100%; height: auto; margin-top: 0.5rem; .flex; .f_column; gap: 0.6rem;
                                .one { width: 100%; height: auto; .flex; .j_justify; .a_end; padding-bottom: 0.2rem; border-bottom: 1px solid #efefef; 
                                    .ic { font-size: var(--font16); color: #666666; line-height: 2; }
                                    .on { color: #0000b9; font-family: "Rubik"; .flex; .a_end; .j_center; gap: 0.1rem;
                                        span { font-size: var(--font60); line-height: 1; }
                                        i { font-style: unset; line-height: 2.5; display: block; font-size: var(--font16); }
                                    }
                                }
                            }
                        }
                    }
                }
            }
            @media @max990 {
                .right_box { padding-left: 0; border: 0; }
            }
        }
    }
}
.ins_aboutCon5 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    background-image: url(../images/bg9.jpg); background-color: #f5f5f5; background-size: cover;  
    .center_box { width: 100%; height: auto; 
        .ins_title .t1 { font-weight: 600; }
        .item_box { width: 100%; height: auto; margin-top: 0.8rem; .flex; .f_column; gap: 0.7rem; 
            .item { width: 100%; height: auto; padding-left: 0.27rem; position: relative; z-index: 1; font-size: var(--font36);
                &::after { content:''; position: absolute;  width: 0.1rem; height: 0.1rem; background: var(--active_color2); .dh;  left: 0; top: 0.7em; border-radius: 50%; }
                .icon { font-weight: 600; color: var(--active_color2); }
                .word { width: 100%; height: auto; margin-top: 0.15rem; }
            }
        }
        .list { width: 100%; height: auto; .flex; gap: 0.7rem; margin-top: 0.9rem; 
            .one { width: fit-content; 
                .icon { width: 0.56rem; height: 0.56rem; }
                .word { width: 100%; height: auto; margin-top: 0.2rem;
                    .t1 { font-weight: 600; }
                    .t2 { width: 100%; height: auto; margin-top: 0.15rem; }
                }
            }
        }
    }
}

.ins_aboutCon6 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    background-image: url(../images/bg10.jpg); background-color: #f5f5f5; background-size: cover;  
    .center_box { width: 100%; height: auto; 
        .ins_title .t1 { font-weight: 600; }
        .item_box { width: 100%; height: auto; .flex; .j_justify; margin-top: 0.9rem; position: relative; z-index: 1;
            &::after { content:''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50vw); width: 100vw; height: 1px; background: #666666; .dh; opacity: 0.15; }
            .item { font-size: var(--font16); color: #00000099; position: relative; z-index: 1; .flex; .a_center; .j_center; padding-bottom: 0.23rem; cursor: pointer; .dh;
                i { position: absolute; bottom: 0; width: 0.08rem; height: 0.08rem; background: #b1b1b1; .flex; .a_center; .j_center; transform: translateY(50%); border-radius: 50%; .dh;
                    &::after { content:''; position: absolute;  width: 0.2rem; height: 0.2rem; background: #000; .dh; border-radius: 50%; opacity: 0.1; }
                }
                &:hover { color: var(--active_color2); }
                &.active { color: var(--active_color2); 
                    i{ background: var(--active_color2); &::after { background: var(--active_color2); opacity: 0.3; } }
                }
            }
        }
        .swiper_info { width: 100%; height: auto; .flex; .j_justify; gap: 0.5rem; .a_end; margin-top: 1rem; 
            .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden;
                ul li { width: auto; height: auto; 
                    .centerInfo { width: 100%; height: auto; 
                        .number { font-size: 2rem; line-height: 1; background-image: linear-gradient(180deg, #b6d88e, #ffffff00 75%, #ffffff00); -webkit-background-clip: text; background-clip: text; color: transparent; text-align: center; font-family: "Gilroy"; font-weight: 600; }
                        .word { font-size: var(--font16); line-height: 2.25; text-align: center; margin-top: -0.5rem; }
                    }
                }
            }
            .btnSwi { width: 0.5rem; height: 0.5rem; min-width: 38px; min-height: 38px; .flex; .a_center; .j_center; border: 2px solid #FFFFFF; border-radius: 50%; .dh; cursor: pointer;  flex-shrink: 0; background: #FFFFFF; transform: translateY(-0.3rem); 
                i { color: #808080; font-weight: 300; .dh; font-size: var(--font22); .flex; .a_center; .j_center; }
                &:hover { background: var(--active_color2); border-color: var(--active_color2); i { color: #FFFFFF !important; } }
            }
        }
        @media @max990 {
            .item_box { width: 100%; height: auto; overflow: auto; gap: 0.3rem; padding-bottom: 0.3rem; display: none;
                .item { width: max-content; word-spacing: normal; font-size: var(--font18); }
            }
            .swiper_info { width: 100%; height: auto; .flex; .f_column; .a_center; padding-bottom: 1.2rem;
                .swiper_box  ul li .centerInfo {
                    .number { font-size: 1.3rem; text-align: left; }
                    .word { text-align: left; line-height: 1.8; margin-top: 0; }
                }
                .btnSwi { bottom: 0; transform: translateY(0); position: absolute; 
                    &.next { transform: translateX(100%); }
                    &.prev { transform: translateX(-100%); }
                }
            }
        }
    }
}

.ins_aboutCon7 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; 
    .center_box { width: 100%; height: auto; 
        .top_box { width: 100%; height: auto; .flex; .j_justify; 
            .ins_title .t1 { font-weight: 600; }
            .item_box {  width: fit-content; .flex; gap: 0.13rem; 
                .item { padding: 0 0.37rem; width: auto; height: 0.47rem; min-height: 35px; background: #f3f3f3; border-radius: 100px; .flex; .a_center; .j_center; font-size: var(--font16); .dh; cursor: pointer;
                    &:hover { color: var(--active_color2); }
                    &.active { background: var(--active_color2); color: #FFFFFF; }
                }
            }
        }
        .swiper_info { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.6rem;
            .swiper_box { width: 100%; height: auto; 
                ul li { width: 100%; height: auto; 
                    .centerInfo { width: 100%; height: auto; opacity: 0; .dh; pointer-events: none;
                        .swiper_img { width: 100%; height: auto; position: relative; z-index: 1; 
                            .list { width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.2rem 0.6rem; opacity: 0; .dh; pointer-events: none;
                                .one { width: 100%; height: auto; position: relative; z-index: 1; 
                                    .img { width: 100%; height: auto; .flex; .a_center; .j_center; img { width: 150%; max-width: unset; max-height: unset; } }
                                    .word { width: 100%; height: auto; position: absolute; bottom: 0.3rem; text-align: center; font-size: var(--font18); }
                                }
                            }
                            .swiper-slide-active .list { opacity: 1; pointer-events: initial; }
                        }
                    }
                    &.swiper-slide-active .centerInfo { opacity: 1; pointer-events: initial; }
                }
            }
        }
        @media @max990 {
            .top_box { .f_column; gap: 0.2rem; }
            .swiper_info .swiper_box ul li .centerInfo .swiper_img .swiper-slide-active .list { display: grid; grid-template-columns: repeat(2, 1fr); }
        }
    }
}

.ins_aboutCon8  { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0;
    background-image: url(../images/bg11.jpg); background-color: #f5f5f5; background-size: cover;  
    .center_box { width: 100%; height: auto; 
        .top_box { width: 100%; height: auto; .flex; .j_justify; 
            .ins_title .t1 { font-weight: 600; }
            .idx_more { width: fit-content; .more { padding: 0 0.25rem; line-height: 1; } }
        }
        .item_box { width: 100%; height: auto; position: relative; z-index: 1; display: grid; grid-template-columns: repeat(7, 1fr); border-bottom: 1px solid #efefef; border-left: 1px solid #efefef; margin-top: 0.55rem;
            .item { width: 100%; height: auto; background: #FFFFFF; border-top: 1px solid #efefef; border-right: 1px solid #efefef; .pb { padding-bottom: 59%; } }
            @media @max990 { display: grid; grid-template-columns: repeat(3, 1fr); }
        }
    }
}

@media @max990 {
    .idx_case .box_info .left_box .pager_box {  display: none; }
    .ins_aboutCon1 .center_box .ins_tBox .right_box { line-height: 1.8; }
}

.ins_contactCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.6rem; padding-bottom: 1.3rem;
    background-image: url(../images/bg12.jpg); background-color: #f5f5f5; background-size: cover; 
    .center_box { width: 100%; height: auto; 
        .left_box { width: 42%; 
            .word_box { width: 100%; height: auto; padding-bottom: 0.5rem; position: relative; z-index: 1;
                &::after { content:''; position: absolute; bottom: 0; right: 0; width: 100%; height: 1px; opacity: 0.1; background: #000; .dh; }
                .t1 { font-weight: 600; }
                .t2 { font-weight: 600; margin-top: 0.10rem; }
                .t3 { color: #999999; margin-top: 0.25rem; }
            }
            .item_box { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.65rem; .flex; .f_column; gap: 0.6rem;
                .item { width: 100%; height: auto; .flex; gap: 0.25rem; 
                    .icon { width: 0.62rem; height: 0.62rem; flex-shrink: 0; }
                    .word {  width: fit-content; 
                        .title { color: #999999; font-size: var(--font16); }
                        .one { width: 100%; height: auto; margin-top: 0.1rem; line-height: 2; font-size: var(--font18); 
                            span { font-size: var(--font26); padding-right: 0.2rem;
                                &:last-child { padding: 0; }
                            }
                        }
                    }
                }
            }
        }
        .right_box { width: 52%; background: #FFFFFF; padding: 0.5rem; border-radius: 0.3rem; padding-bottom: 0.6rem;
            .t1 { font-weight: 600; }
            .t2 { color: #999999; margin-top: 0.10rem; }
            .content { width: 100%; height: auto; margin: 0 auto; margin-top: 0.4rem;
                .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(1, 1fr); gap: 0.2rem; 
                    .item { width: 100%; height: 0.54rem; min-height: 40px; background: #FFFFFF;  border: 1px solid #e4e4e4; border-radius: 100px; padding: 0 0.3rem; .flex; .a_center; font-size: var(--font14); gap: 0.05rem; .j_justify;
                        span { flex-shrink: 0; color: #999999; }
                        img { flex-shrink: 0; max-width: 1.17rem; max-height: 0.63rem; }
                        input , select { width: 100%; height: 100%; border: 0; background: none; }
                        button { width: 100%; height: 100%; background: none; border: 0; color: #FFFFFF; font-weight: 500; font-size: var(--font16); cursor: pointer; }
                        &.button { background: var(--active_color2); border-color: var(--active_color2); cursor: pointer; }
                        .layui-form-select { width: 100%; height: 100%; .flex; .a_center; font-weight: 500;  }
                        .layui-select-title { width: 100%; height: 100%; box-shadow: unset !important; }
                        .layui-input:focus, .layui-textarea:focus { border: unset !important;  box-shadow: unset !important; }
                        .layui-form-select dl { top: 100%; }
                    }
                }
                .layraBox { width: 100%; height: auto; margin-top: 0.2rem;
                    .layradio {  }
                    span, a { display: inline !important; }
                    span { color: #999999; }
                    a { color: #000; text-decoration: underline; }
                    .layui-form-radio:hover>*, .layui-form-radioed, .layui-form-radioed>i { color: var(--active_color); }
                    .layui-form-radio>* { display: contents; }
                }
                @media @max990 { max-width: 100%; 
                    .item { width: 100%; height: auto; }
                }
            }
        }
    }
}



.top_jion { width: 100%; height: auto; 
    .left_box { width: 30%; 
        .title { width: fit-content; height: auto; line-height: 1.25; font-weight: 600; position: relative; z-index: 1;
            span { color: var(--active_color2); }
            .img { position: absolute; width: 1.55rem; top: 0; left: 0; transform: translateX(80%) translateY(-50%);  }
        }
    }
    .right_box { width: 38%;
        .t1 { line-height: 1.85; span { color: var(--active_color2); } }
    }
}
.ins_joinCon1 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.4rem; padding-bottom: 0.8rem;
    .center_box { width: 100%; height: auto; 
        .content { width: 100%; height: 5.5rem; margin-top: 0.7rem; border-radius: 0.2rem; overflow: hidden; background-image: url(../images/zz83.jpg); background-color: #f5f5f5; background-size: cover; }
    }
}



.ins_joinCon2 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .center_box { width: 100%; height: auto;  border-bottom: 1px solid #f0f0f0; padding: 0.8rem 0; 
        .top_jion .right_box { width: 44%; }
    }
}


.ins_joinCon3 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1rem 0; 
    .center_box { width: 100%; height: auto;  
        .top_jion .left_box { width: 100%; }
        .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.22rem; margin-top: 0.57rem;
            .item { width: 100%; height: auto; padding: 0 0.8rem; padding-top: 1.1rem; padding-bottom: 1.4rem; position: relative; z-index: 1; border: 1px solid #ebebeb; border-radius: 0.2rem; overflow: hidden;
                .icon { width: 0.62rem; height: 0.62rem; img { filter: brightness(0) invert(0); .dh; } }
                .word { width: 100%; height: auto; margin-top: 0.4rem; 
                    .t1 { font-weight: 600; .dh; }
                    .t2 { width: 100%; height: auto; margin-top: 0.2rem; color: #999999; .dh; }
                }
                .img_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0; .dh(0.7); img { width: 100%; height: 100%; object-fit: cover; } }
                &:hover {
                    .icon img { filter: brightness(0) invert(1); }
                    .word { color: #FFFFFF; .t2 { color: #FFFFFF; } }
                    .img_bg { opacity: 1; }
                }
            }
            @media @max990 { display: grid; grid-template-columns: repeat(1, 1fr); 
                .item  { padding: 0.6rem 0.4rem; }
            }
        }
    }
}





.ins_joinCon4 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.6rem; padding-bottom: 1.3rem;
    background-image: url(../images/zz85.jpg); background-color: #f5f5f5; background-size: cover; 
    .center_box { width: 100%; height: auto; 
        .title { color: #FFFFFF; font-weight: 600; line-height: 1.25; }
        .item_box { width: 100%; height: auto; margin-top: 3rem; .flex; .j_justify;
            .item { color: #FFFFFF; width: 25%;
                .icon { width: 0.52rem; height: 0.52rem; }
                .t1 { font-weight: 600; margin-top: 0.3rem; }
                .t2 { margin-top: 0.25rem; line-height: 1.8; }
            }
            @media @max990 { display: grid; grid-template-columns: repeat(1, 1fr); gap: 0.8rem; margin-top: 2rem;
                .item { width: 100%; height: auto; 
                    .icon { position: absolute; left: 0; }
                    .t1 { padding-left: 1rem; margin-top: 0; }
                }
            }
        }
    }
}
    

.ins_joinCon5 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 0.8rem; padding-bottom: 1.2rem;
    .center_box { width: 100%; height: auto; 
        .ins_title .t1 { font-weight: 600;}
        .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 0.7rem; .dh(0.7);
            .item { width: 100%; height: auto; border-radius: 0.16rem; overflow: hidden;
                &.grid2 { grid-row: span 2; }
                img { width: 100%; height: 100%; object-fit: cover; .dh; }
                &:hover img { transform: scale(1.04); } 
            }
            &.active { gap: 0.25rem; }
            @media @max990 { display: grid; grid-template-columns: repeat(2, 1fr); }
        }
    }
}


.ins_joinCon6 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.2rem; padding-bottom: 1.1rem; background: #f7f8f6;
    .center_box { width: 100%; height: auto; 
        .ins_title .t1 { font-weight: 600;}
        .item_box { width: 100%; height: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.4rem; margin-top: 0.5rem;
            .item { width: 100%; height: auto; background: #FFFFFF; border-radius: 0.15rem; overflow: hidden;
                .left_box { width: 50%; padding: 0.8rem 0.5rem; .flex; .f_column; .j_justify; gap: 0.5rem; 
                    .word { width: 100%; height: auto; 
                        .t1 { color: var(--color1); font-weight: 600; }
                        .t2 { margin-top: 0.2rem; color: #222222; }
                    }
                }
                .right_box { width: 50%; height: auto; overflow: hidden;
                    .img { width: 100%; height: 100%; img { width: 100%; height: 100%; object-fit: cover; .dh; } }
                }
                &:hover {
                    .right_box .img img { transform: scale(1.03); }
                }
            }
            @media @max990 { display: grid; grid-template-columns: repeat(1, 1fr); 
                .item {
                    .left_box { padding: 0.5rem 0.4rem; padding-bottom: 0rem; }
                    .right_box .img { height: 200px; overflow: hidden; }
                }
            }
        }
    }
}


.ins_solvedCon12 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.1rem;  padding-bottom: 1rem;
    .center_box  { width: 100%; height: auto; 
        .ins_title { .t2 { margin-top: 0.15rem;  } }
        .top_box { width: 100%; height: auto; .flex; .j_justify; .a_center; 
            .pagerSwiper .btnSwi { width: 0.46rem; height: 0.46rem; border: 1px solid #cfcfcf; 
                i { font-size: var(--font14); color: #000; } 
                &:hover { border-color: var(--active_color2); i { color: #FFFFFF; } }
            }
        }
        .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.7rem; 
            ul li { width: 32%; height: auto;
                .centerInfo { width: 100%; height: 100%; border: 2px solid #f2f2f2; padding:0.4rem 0.3rem; cursor: pointer; .dh; position: relative; z-index: 1; overflow: hidden; .flex; .f_column; .j_justify;
                    &::after { content:''; position: absolute;  width: 100%; height: 0%; background: var(--active_color2); .dh; top: 0;  left: 0; z-index: -1; border-bottom-right-radius: 100%; border-bottom-left-radius: 100%; }
                    &::before { content:''; position: absolute; bottom: 0; right: 0; width: 100%; height: 0.05rem; background: var(--active_color); .dh(0.6); }
                    .word { width: 100%; height: auto; 
                        .t1 { font-weight: 600; .dh; }
                        .t2 { margin-top: 0.3rem; .dh; line-height: 1.875; .flex; .f_column; gap: 0.05rem; 
                            p { position: relative; z-index: 1; padding-left: 0.14rem; 
                                &::after { content:''; position: absolute;  width: 0.05rem; height: 0.05rem; background: #c1c1c1; .dh; top: 0.7em; left: 0; border-radius: 50%; }
                            }
                        }
                    }
                    .img { width: 100%; height: auto; margin-top: 0.5rem; .pb { padding-bottom: 46%; img { width: 100%; height: 100%; object-fit: cover; } } }
                    &:hover { 
                        &::after { height: 100%; border-radius: 0; }
                        &::before {  background: #bdde95; }
                        .icon { img { filter: brightness(0) invert(1); } }
                        .word {
                            .t1 { color: #FFFFFF; }
                            .t2 { color: #FFFFFF; p::after { background: #FFFFFF; } }
                        }
                    }
                }
            }
        }
    }
}


.ins_solvedCon13 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.1rem;  padding-bottom: 1rem;
    .center_box  { width: 100%; height: auto; 
        .ins_title { .t2 { margin-top: 0.15rem;  } }
        .top_box { width: 100%; height: auto; .flex; .j_justify; .a_center; 
            .pagerSwiper .btnSwi { width: 0.46rem; height: 0.46rem; border: 1px solid #cfcfcf; 
                i { font-size: var(--font14); color: #000; } 
                &:hover { border-color: var(--active_color2); i { color: #FFFFFF; } }
            }
        }
        .swiper_info { width: 100%; height: auto; position: relative; z-index: 1; .flex; .a_center; .j_center; 
            .item_box { width: fit-content; height: auto; position: absolute; z-index: 3; .flex; .a_center; .j_center; bottom: 0.5rem;
                &::after { content:''; position: absolute;  width: 100%; height: 1px; background: #FFF; .dh; bottom: 0; left: 0; }
                .item {  padding: 0.2rem 0.5rem; font-size: var(--font16); color: #FFFFFF; position: relative; z-index: 1; .flex; .a_center; .j_center; cursor: pointer; .dh;
                    &::after { content:''; position: absolute;  width: 0%; height: 2px; background: var(--active_color2); .dh; bottom: 0; }
                    &.active { color: var(--active_color2); &::after { width: 100%; } }
                }
            }
        }
        .swiper_box { width: 100%; height: auto; position: relative; z-index: 1; margin-top: 0.7rem; 
            ul li { width: 32%; height: auto; background: #EEEEEE;                
                .img_box { width: 100%; height: auto; position: relative; z-index: 1; opacity: 0.5; .dh;
                    &::after { content:''; position: absolute; z-index: 2; bottom: 0; right: 0; width: 100%; height: 50%; background:linear-gradient(180deg, #00000000 10%, #0000008a 100%);.dh; }
                    img { width: 100%; height: auto; } 
                }
                &.swiper-slide-active .img_box {  opacity: 1; }
            }
        }
    }
}




.ins_solvedCon14 { width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0; background: #faf6f7;
    .center_box { width: 100%; height: auto; 
        .ins_title { width: 100%; height: auto; 
            .t2 { width: 100%; height: auto; margin-top: 0.15rem; }
        }
        @media @max990 {
            .ins_title { max-width: 100%; }
        }
    }
    .img { width: 100%; height: calc(100vh - var(--header-height)); margin-top: 0.5rem; 
        img, video { width: 100%; height: 100%; object-fit: cover; }
    }
}